diff --git a/clayui.com/src/styles/_autocomplete.scss b/clayui.com/src/styles/_autocomplete.scss
index e58dca5a13..66db362893 100644
--- a/clayui.com/src/styles/_autocomplete.scss
+++ b/clayui.com/src/styles/_autocomplete.scss
@@ -51,8 +51,9 @@
 	.list-group .list-group-item {
 		border-width: 0;
 
-		&:hover, &.active {
-			background-color: #F5F9FF;
+		&:hover,
+		&.active {
+			background-color: #f5f9ff;
 		}
 
 		&:first-child {
@@ -66,4 +67,4 @@
 			border-bottom-right-radius: 4px;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/clayui.com/src/styles/_blog.scss b/clayui.com/src/styles/_blog.scss
index df8341720a..3e4b8db95b 100644
--- a/clayui.com/src/styles/_blog.scss
+++ b/clayui.com/src/styles/_blog.scss
@@ -23,4 +23,4 @@
 	.clay-blog-content {
 		max-width: 840px;
 	}
-}
\ No newline at end of file
+}
diff --git a/clayui.com/src/styles/_charts.scss b/clayui.com/src/styles/_charts.scss
index f6652ec3bd..92ba503eda 100644
--- a/clayui.com/src/styles/_charts.scss
+++ b/clayui.com/src/styles/_charts.scss
@@ -1,199 +1,251 @@
 .bb-chart-arcs-title {
-  dominant-baseline: middle;
-  font-size: 1.3em; }
+	dominant-baseline: middle;
+	font-size: 1.3em;
+}
 
 .bb-chart-arcs .bb-chart-arcs-background {
-  fill: #e0e0e0;
-  stroke: none; }
+	fill: #e0e0e0;
+	stroke: none;
+}
 
 .bb-chart-arcs .bb-chart-arcs-gauge-unit {
-  fill: #000;
-  font-size: 16px; }
+	fill: #000;
+	font-size: 16px;
+}
 
 .bb-chart-arcs .bb-chart-arcs-gauge-max {
-  fill: #777; }
+	fill: #777;
+}
 
 .bb-chart-arcs .bb-chart-arcs-gauge-min {
-  fill: #777; }
+	fill: #777;
+}
 
 .bb-chart-arc .bb-gauge-value {
-  fill: #000; }
+	fill: #000;
+}
 
 .bb-area {
-  stroke-width: 0;
-  opacity: 0.2; }
+	stroke-width: 0;
+	opacity: 0.2;
+}
 
 .bb-bar {
-  stroke-width: 0; }
-  .bb-bar._expanded_ {
-    fill-opacity: 0.75; }
+	stroke-width: 0;
+}
+.bb-bar._expanded_ {
+	fill-opacity: 0.75;
+}
 
 .bb-brush .extent {
-  fill-opacity: .1; }
+	fill-opacity: 0.1;
+}
 
 .bb svg {
-  font: 10px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  -webkit-tap-highlight-color: transparent; }
-
-.bb path, .bb line {
-  fill: none;
-  stroke: #e5e5eb; }
+	font: 10px -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+		'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji',
+		'Segoe UI Emoji', 'Segoe UI Symbol';
+	-webkit-tap-highlight-color: transparent;
+}
+
+.bb path,
+.bb line {
+	fill: none;
+	stroke: #e5e5eb;
+}
 
 .bb text {
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  user-select: none; }
-  .bb text tspan {
-    fill: #6b6c7e; }
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	user-select: none;
+}
+.bb text tspan {
+	fill: #6b6c7e;
+}
 
 .bb-legend-item-tile,
 .bb-xgrid-focus,
 .bb-ygrid,
 .bb-event-rect,
 .bb-bars path {
-  shape-rendering: crispEdges; }
+	shape-rendering: crispEdges;
+}
 
 .bb-chart-arc path {
-  stroke: #fff; }
+	stroke: #fff;
+}
 
 .bb-chart-arc text {
-  fill: #fff;
-  font-size: 13px; }
+	fill: #fff;
+	font-size: 13px;
+}
 
 .bb-target.bb-focused {
-  opacity: 1; }
+	opacity: 1;
+}
 
-.bb-target.bb-focused path.bb-line, .bb-target.bb-focused path.bb-step {
-  stroke-width: 2px; }
+.bb-target.bb-focused path.bb-line,
+.bb-target.bb-focused path.bb-step {
+	stroke-width: 2px;
+}
 
 .bb-target.bb-defocused {
-  opacity: 0.3 !important; }
+	opacity: 0.3 !important;
+}
 
 .bb-grid line {
-  stroke: #e5e5eb;
-  stroke-width: 0.5px; }
+	stroke: #e5e5eb;
+	stroke-width: 0.5px;
+}
 
 .bb-grid text {
-  fill: #aaa; }
+	fill: #aaa;
+}
 
 .bb-legend-item {
-  font-size: 12px; }
+	font-size: 12px;
+}
 
 .bb-legend-item-hidden {
-  opacity: 0.15; }
+	opacity: 0.15;
+}
 
 .bb-legend-background {
-  opacity: 0.75;
-  fill: white;
-  stroke: lightgray;
-  stroke-width: 1; }
+	opacity: 0.75;
+	fill: white;
+	stroke: lightgray;
+	stroke-width: 1;
+}
 
 .bb-line {
-  stroke-width: 2px; }
+	stroke-width: 2px;
+}
 
 .bb-line-dashed-2-2 {
-  stroke-dasharray: 2 2; }
+	stroke-dasharray: 2 2;
+}
 
 .bb-line-dashed-2-3 {
-  stroke-dasharray: 2 3; }
+	stroke-dasharray: 2 3;
+}
 
 .bb-line-dashed-2-4 {
-  stroke-dasharray: 2 4; }
+	stroke-dasharray: 2 4;
+}
 
 .bb-line-dashed-3-2 {
-  stroke-dasharray: 3 2; }
+	stroke-dasharray: 3 2;
+}
 
 .bb-line-dashed-3-3 {
-  stroke-dasharray: 3 3; }
+	stroke-dasharray: 3 3;
+}
 
 .bb-line-dashed-3-4 {
-  stroke-dasharray: 3 4; }
+	stroke-dasharray: 3 4;
+}
 
 .bb-line-dashed-4-2 {
-  stroke-dasharray: 4 2; }
+	stroke-dasharray: 4 2;
+}
 
 .bb-line-dashed-4-3 {
-  stroke-dasharray: 4 3; }
+	stroke-dasharray: 4 3;
+}
 
 .bb-line-dashed-4-4 {
-  stroke-dasharray: 4 4; }
+	stroke-dasharray: 4 4;
+}
 
 .loading-icon {
-  min-height: 320px;
-  min-height: 320px;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  vertical-align: middle; }
+	min-height: 320px;
+	min-height: 320px;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	vertical-align: middle;
+}
 
 .bb-circle._expanded_ {
-  stroke-width: 1px;
-  stroke: white; }
+	stroke-width: 1px;
+	stroke: white;
+}
 
 .bb-selected-circle {
-  fill: white;
-  stroke-width: 2px; }
+	fill: white;
+	stroke-width: 2px;
+}
 
 .bb-region {
-  fill: steelblue;
-  fill-opacity: .1; }
+	fill: steelblue;
+	fill-opacity: 0.1;
+}
 
 .bb-text.bb-empty {
-  fill: #808080;
-  font-size: 2em; }
+	fill: #808080;
+	font-size: 2em;
+}
 
 .bb-title {
-  font: 14px sans-serif; }
+	font: 14px sans-serif;
+}
 
 .bb-tooltip-container {
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: 1060;
-  display: block;
-  max-width: 276px;
-  padding: 1px;
-  font-style: normal;
-  font-weight: normal;
-  line-height: 1.5;
-  text-align: start;
-  word-break: normal;
-  word-spacing: normal;
-  white-space: normal;
-  line-break: auto;
-  font-size: 0.875rem;
-  word-wrap: break-word;
-  background-color: #fff;
-  background-clip: padding-box;
-  border: 1px solid rgba(0, 0, 0, 0.2);
-  border-radius: 0.3rem; }
+	position: absolute;
+	top: 0;
+	left: 0;
+	z-index: 1060;
+	display: block;
+	max-width: 276px;
+	padding: 1px;
+	font-style: normal;
+	font-weight: normal;
+	line-height: 1.5;
+	text-align: start;
+	word-break: normal;
+	word-spacing: normal;
+	white-space: normal;
+	line-break: auto;
+	font-size: 0.875rem;
+	word-wrap: break-word;
+	background-color: #fff;
+	background-clip: padding-box;
+	border: 1px solid rgba(0, 0, 0, 0.2);
+	border-radius: 0.3rem;
+}
 
 .bb-tooltip {
-  border-spacing: 0;
-  background-color: #fff;
-  empty-cells: show;
-  opacity: 0.9;
-  box-shadow: 7px 7px 12px -9px #777777; }
-  .bb-tooltip th {
-    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
-    font-size: 14px;
-    padding: 2px 5px;
-    text-align: left;
-    color: #000; }
-  .bb-tooltip td {
-    font-size: 13px;
-    padding: 3px 6px;
-    background-color: #fff; }
-    .bb-tooltip td > span {
-      display: inline-block;
-      width: 10px;
-      height: 10px;
-      margin-right: 6px; }
-    .bb-tooltip td.value {
-      text-align: right; }
-    .bb-tooltip td svg {
-      width: 10px;
-      height: 10px;
-      margin-right: 2px; }
-
-/*# sourceMappingURL=main.css.map */
\ No newline at end of file
+	border-spacing: 0;
+	background-color: #fff;
+	empty-cells: show;
+	opacity: 0.9;
+	box-shadow: 7px 7px 12px -9px #777777;
+}
+.bb-tooltip th {
+	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
+	font-size: 14px;
+	padding: 2px 5px;
+	text-align: left;
+	color: #000;
+}
+.bb-tooltip td {
+	font-size: 13px;
+	padding: 3px 6px;
+	background-color: #fff;
+}
+.bb-tooltip td > span {
+	display: inline-block;
+	width: 10px;
+	height: 10px;
+	margin-right: 6px;
+}
+.bb-tooltip td.value {
+	text-align: right;
+}
+.bb-tooltip td svg {
+	width: 10px;
+	height: 10px;
+	margin-right: 2px;
+}
+
+/*# sourceMappingURL=main.css.map */
diff --git a/clayui.com/src/styles/_docsearch.scss b/clayui.com/src/styles/_docsearch.scss
index c5d8351f3f..fa64c3cea9 100644
--- a/clayui.com/src/styles/_docsearch.scss
+++ b/clayui.com/src/styles/_docsearch.scss
@@ -1,137 +1,145 @@
 .page-autocomplete {
-    max-width: 550px;
+	max-width: 550px;
 }
 
 .page-autocomplete .algolia-autocomplete {
-    display: block !important;
-    flex: 1;
-    width: 100%;
+	display: block !important;
+	flex: 1;
+	width: 100%;
 
-    .ds-dropdown-menu {
-        max-width: auto;
-        min-width: auto;
-    }
+	.ds-dropdown-menu {
+		max-width: auto;
+		min-width: auto;
+	}
 }
 
 .page-autocomplete .algolia-autocomplete .ds-dropdown-menu {
-    width: 100%;
-    padding: .75rem 0 !important;
-    background-color: #fff;
-    background-clip: padding-box;
-    border: 1px solid rgba(0, 0, 0, 0.1);
-    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175);
+	width: 100%;
+	padding: 0.75rem 0 !important;
+	background-color: #fff;
+	background-clip: padding-box;
+	border: 1px solid rgba(0, 0, 0, 0.1);
+	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175);
 }
 
 .algolia-autocomplete .ds-dropdown-menu::before {
-    display: none !important;
+	display: none !important;
 }
 
-.algolia-autocomplete .ds-dropdown-menu [class^="ds-dataset-"] {
-    padding: 0 !important;
-    overflow: visible !important;
-    background-color: transparent !important;
-    border: 0 !important;
+.algolia-autocomplete .ds-dropdown-menu [class^='ds-dataset-'] {
+	padding: 0 !important;
+	overflow: visible !important;
+	background-color: transparent !important;
+	border: 0 !important;
 }
 
 .algolia-autocomplete .ds-dropdown-menu .ds-suggestions {
-    margin-top: 0 !important;
+	margin-top: 0 !important;
 }
 
 .algolia-autocomplete .algolia-docsearch-suggestion {
-    padding: 0 !important;
-    overflow: visible !important;
+	padding: 0 !important;
+	overflow: visible !important;
 }
 
 .algolia-autocomplete .algolia-docsearch-suggestion--category-header {
-    padding: .125rem 1rem !important;
-    margin-top: 0 !important;
-    font-size: .875rem !important;
-    font-weight: 500 !important;
-    color: $brand-dark !important;
-    border-bottom: 0 !important;
+	padding: 0.125rem 1rem !important;
+	margin-top: 0 !important;
+	font-size: 0.875rem !important;
+	font-weight: 500 !important;
+	color: $brand-dark !important;
+	border-bottom: 0 !important;
 }
 
 .algolia-autocomplete .algolia-docsearch-suggestion--wrapper {
-    float: none !important;
-    padding-top: 0 !important;
+	float: none !important;
+	padding-top: 0 !important;
 }
 
 .algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column {
-    float: none !important;
-    width: auto !important;
-    padding: 0 !important;
-    text-align: left !important;
+	float: none !important;
+	width: auto !important;
+	padding: 0 !important;
+	text-align: left !important;
 }
 
 .algolia-autocomplete .algolia-docsearch-suggestion--content {
-    float: none !important;
-    width: auto !important;
-    padding: 0 !important;
+	float: none !important;
+	width: auto !important;
+	padding: 0 !important;
 }
 
 .algolia-autocomplete .algolia-docsearch-suggestion--content::before {
-    display: none !important;
+	display: none !important;
 }
 
-.algolia-autocomplete .ds-suggestion:not(:first-child) .algolia-docsearch-suggestion--category-header {
-    padding-top: .75rem !important;
-    margin-top: .75rem !important;
-    border-top: 1px solid rgba(0, 0, 0, 0.1);
+.algolia-autocomplete
+	.ds-suggestion:not(:first-child)
+	.algolia-docsearch-suggestion--category-header {
+	padding-top: 0.75rem !important;
+	margin-top: 0.75rem !important;
+	border-top: 1px solid rgba(0, 0, 0, 0.1);
 }
 
-.algolia-autocomplete .ds-suggestion .algolia-docsearch-suggestion--subcategory-column {
-    display: none !important;
+.algolia-autocomplete
+	.ds-suggestion
+	.algolia-docsearch-suggestion--subcategory-column {
+	display: none !important;
 }
 
 .algolia-autocomplete .algolia-docsearch-suggestion--title {
-    display: block;
-    padding: .25rem 1rem !important;
-    margin-bottom: 0 !important;
-    font-size: .875rem !important;
-    font-weight: 400 !important;
+	display: block;
+	padding: 0.25rem 1rem !important;
+	margin-bottom: 0 !important;
+	font-size: 0.875rem !important;
+	font-weight: 400 !important;
 }
 
 .algolia-autocomplete .algolia-docsearch-suggestion--text {
-    padding: 0 1rem .5rem !important;
-    margin-top: -.25rem;
-    font-size: .875rem !important;
-    font-weight: 400;
-    line-height: 1.25 !important;
+	padding: 0 1rem 0.5rem !important;
+	margin-top: -0.25rem;
+	font-size: 0.875rem !important;
+	font-weight: 400;
+	line-height: 1.25 !important;
 }
 
 .algolia-autocomplete .algolia-docsearch-footer {
-    float: none !important;
-    width: auto !important;
-    height: auto !important;
-    padding: .75rem 1rem 0;
-    font-size: .75rem !important;
-    line-height: 1 !important;
-    color: #767676 !important;
-    border-top: 1px solid rgba(0, 0, 0, 0.1);
+	float: none !important;
+	width: auto !important;
+	height: auto !important;
+	padding: 0.75rem 1rem 0;
+	font-size: 0.75rem !important;
+	line-height: 1 !important;
+	color: #767676 !important;
+	border-top: 1px solid rgba(0, 0, 0, 0.1);
 }
 
 .algolia-autocomplete .algolia-docsearch-footer--logo {
-    display: inline !important;
-    overflow: visible !important;
-    color: inherit !important;
-    text-indent: 0 !important;
-    background: none !important;
+	display: inline !important;
+	overflow: visible !important;
+	color: inherit !important;
+	text-indent: 0 !important;
+	background: none !important;
 }
 
 .algolia-autocomplete .algolia-docsearch-suggestion--highlight {
-    color: $brand-dark;
-    background-color: rgba(179, 71, 45, 0.12);
+	color: $brand-dark;
+	background-color: rgba(179, 71, 45, 0.12);
 }
 
-.algolia-autocomplete .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight {
-    box-shadow: inset 0 -2px 0 0 rgba(179, 71, 45, 0.5) !important;
+.algolia-autocomplete
+	.algolia-docsearch-suggestion--text
+	.algolia-docsearch-suggestion--highlight {
+	box-shadow: inset 0 -2px 0 0 rgba(179, 71, 45, 0.5) !important;
 }
 
-.algolia-autocomplete .ds-suggestion.ds-cursor .algolia-docsearch-suggestion--content {
-    background-color: rgba(179, 71, 45, 0.15) !important;
+.algolia-autocomplete
+	.ds-suggestion.ds-cursor
+	.algolia-docsearch-suggestion--content {
+	background-color: rgba(179, 71, 45, 0.15) !important;
 }
 
 .algolia-docsearch-suggestion--content,
 .algolia-docsearch-suggestion--title {
-    display: block !important;
-}
\ No newline at end of file
+	display: block !important;
+}
diff --git a/clayui.com/src/styles/_landing.scss b/clayui.com/src/styles/_landing.scss
index 64a74e7586..626400a6dd 100644
--- a/clayui.com/src/styles/_landing.scss
+++ b/clayui.com/src/styles/_landing.scss
@@ -1,376 +1,376 @@
 .vertical-title {
-    color: #CDCED9;
-    font-size: 13px;
-    font-weight: 700;
-    letter-spacing: 3px;
-    margin-top: 250px;
-    text-transform: uppercase;
-    transform: rotate(-90deg);
+	color: #cdced9;
+	font-size: 13px;
+	font-weight: 700;
+	letter-spacing: 3px;
+	margin-top: 250px;
+	text-transform: uppercase;
+	transform: rotate(-90deg);
 }
 
 .home {
-    background-color: $brand-bg-dark;
-
-    .font-weight-bold {
-        font-weight: 900 !important;
-    }
-
-    .card {
-        border-radius: 12px;
-        box-shadow: 4px 6px 36px rgba(48, 49, 63, 0.15);
-        margin-bottom: 32px;
-        min-height: 100%;
-        transition: all 0.4s;
-
-        .learn-more {
-            color: #D2D3DD;
-            display: inline-flex;
-            font-size: 15px;
-            font-weight: bold;
-        }
-
-        &:hover {
-            background-color: #FFF6F5;
-            box-shadow: 6px 9px 36px rgba(48, 49, 63, 0.2);
-            transform: translateY(-4px);
-
-            .learn-more {
-                color: $brand-dark;
-            }
-        }
-
-        h2 {
-            color: #393A4A;
-            font-size: 21px;
-            line-height: 1.6;
-            margin-bottom: 16px;
-        }
-
-        .btn {
-            color: #393A4A;
-            font-size: 11px;
-            letter-spacing: 1.5px;
-        }
-
-        p {
-            color: #A1A3B6;
-            font-size: 18px;
-            line-height: 1.6;
-            margin-bottom: 16px;
-
-            @include media-breakpoint-up(sm) {
-                margin-bottom: 32px;
-            }
-        }
-
-        img.mx-auto {
-            margin: 32px 0 40px;
-            width: 98px;
-        }
-    }
+	background-color: $brand-bg-dark;
+
+	.font-weight-bold {
+		font-weight: 900 !important;
+	}
+
+	.card {
+		border-radius: 12px;
+		box-shadow: 4px 6px 36px rgba(48, 49, 63, 0.15);
+		margin-bottom: 32px;
+		min-height: 100%;
+		transition: all 0.4s;
+
+		.learn-more {
+			color: #d2d3dd;
+			display: inline-flex;
+			font-size: 15px;
+			font-weight: bold;
+		}
+
+		&:hover {
+			background-color: #fff6f5;
+			box-shadow: 6px 9px 36px rgba(48, 49, 63, 0.2);
+			transform: translateY(-4px);
+
+			.learn-more {
+				color: $brand-dark;
+			}
+		}
+
+		h2 {
+			color: #393a4a;
+			font-size: 21px;
+			line-height: 1.6;
+			margin-bottom: 16px;
+		}
+
+		.btn {
+			color: #393a4a;
+			font-size: 11px;
+			letter-spacing: 1.5px;
+		}
+
+		p {
+			color: #a1a3b6;
+			font-size: 18px;
+			line-height: 1.6;
+			margin-bottom: 16px;
+
+			@include media-breakpoint-up(sm) {
+				margin-bottom: 32px;
+			}
+		}
+
+		img.mx-auto {
+			margin: 32px 0 40px;
+			width: 98px;
+		}
+	}
 }
 
 .intro {
-    background-size: auto;
-    color: $brand-light;
-    margin-bottom: 32px;
-    padding: 88px 0;
-
-    @media (max-width: $screen-md) {
-        text-align: center !important;
-    }
-
-    @include media-breakpoint-up(sm) {
-        padding: 203px 0 216px;
-    }
-
-    .brand {
-        display: inline-block;
-        margin-bottom: 43px;
-
-        .logo {
-            max-height: 84px;
-            margin-right: 22px;
-
-            @media (max-width: $screen-md) {
-                max-width: 60px;
-            }
-        }
-
-        .title {
-            font-size: 84px;
-            font-weight: 700;
-            color: $brand-dark;
-
-            @media (max-width: $screen-md) {
-                font-size: 60px;
-            }
-        }
-
-        &:hover {
-            text-decoration: none;
-        }
-    }
-
-    .nav-item {
-        position: relative;
-
-        &::before {
-            content: "・";
-            color: $brand-dark;
-            position: absolute;
-            right: 1px;
-        }
-
-        &:last-child::before {
-            content: "";
-        }
-    }
-
-    .h1 {
-        font-size: 36px;
-        font-weight: 900;
-        line-height: 1;
-        margin: 52px 0 24px;
-        word-break: normal;
-
-        @include media-breakpoint-up(sm) {
-            font-size: 64px;
-        }
-
-        @include media-breakpoint-up(lg) {
-            font-size: 96px;
-            margin-bottom: 48px;
-        }
-    }
-
-    .h2 {
-        color: $brand-lighter;
-        font-size: 36px;
-        font-weight: 600;
-        line-height: 57px;
-
-        @include media-breakpoint-up(lg) {
-            font-size: 48px;
-            margin-bottom: 73px;
-        }
-
-        @media (max-width: $screen-md) {
-            font-size: 31px;
-            line-height: 43px;
-            margin-bottom: 40px;
-        }
-    }
-
-    .h3 {
-        color: rgba(255, 255, 255, 0.6);
-        font-size: 18px;
-        font-weight: 700;
-        letter-spacing: 4px;
-        line-height: 1.7;
-        margin-bottom: 56px;
-
-        @include media-breakpoint-up(sm) {
-            font-size: 28px;
-            letter-spacing: 0.4px;
-            margin-bottom: 72px;
-        }
-    }
+	background-size: auto;
+	color: $brand-light;
+	margin-bottom: 32px;
+	padding: 88px 0;
+
+	@media (max-width: $screen-md) {
+		text-align: center !important;
+	}
+
+	@include media-breakpoint-up(sm) {
+		padding: 203px 0 216px;
+	}
+
+	.brand {
+		display: inline-block;
+		margin-bottom: 43px;
+
+		.logo {
+			max-height: 84px;
+			margin-right: 22px;
+
+			@media (max-width: $screen-md) {
+				max-width: 60px;
+			}
+		}
+
+		.title {
+			font-size: 84px;
+			font-weight: 700;
+			color: $brand-dark;
+
+			@media (max-width: $screen-md) {
+				font-size: 60px;
+			}
+		}
+
+		&:hover {
+			text-decoration: none;
+		}
+	}
+
+	.nav-item {
+		position: relative;
+
+		&::before {
+			content: '・';
+			color: $brand-dark;
+			position: absolute;
+			right: 1px;
+		}
+
+		&:last-child::before {
+			content: '';
+		}
+	}
+
+	.h1 {
+		font-size: 36px;
+		font-weight: 900;
+		line-height: 1;
+		margin: 52px 0 24px;
+		word-break: normal;
+
+		@include media-breakpoint-up(sm) {
+			font-size: 64px;
+		}
+
+		@include media-breakpoint-up(lg) {
+			font-size: 96px;
+			margin-bottom: 48px;
+		}
+	}
+
+	.h2 {
+		color: $brand-lighter;
+		font-size: 36px;
+		font-weight: 600;
+		line-height: 57px;
+
+		@include media-breakpoint-up(lg) {
+			font-size: 48px;
+			margin-bottom: 73px;
+		}
+
+		@media (max-width: $screen-md) {
+			font-size: 31px;
+			line-height: 43px;
+			margin-bottom: 40px;
+		}
+	}
+
+	.h3 {
+		color: rgba(255, 255, 255, 0.6);
+		font-size: 18px;
+		font-weight: 700;
+		letter-spacing: 4px;
+		line-height: 1.7;
+		margin-bottom: 56px;
+
+		@include media-breakpoint-up(sm) {
+			font-size: 28px;
+			letter-spacing: 0.4px;
+			margin-bottom: 72px;
+		}
+	}
 }
 
 .btn-warning-borderless {
-    color: $brand-lighter;
+	color: $brand-lighter;
 
-    &:hover {
-        color: $brand-lighter;
-    }
+	&:hover {
+		color: $brand-lighter;
+	}
 }
 
 .btn-borderless {
-    border: 1px solid $brand-lighter;
+	border: 1px solid $brand-lighter;
 }
 
 .btn-brand-color {
-    color: $brand-dark;
+	color: $brand-dark;
 
-    &:hover {
-        color: $brand-lighter;
-    }
+	&:hover {
+		color: $brand-lighter;
+	}
 }
 
 .title-section {
-    font-size: 32px;
-    color: $brand-dark;
-    font-weight: 700;
-    margin-bottom: 43px;
-
-    svg {
-        font-size: 42px;
-        margin-right: 28px;
-    }
-
-    @media (max-width: $screen-md) {
-        font-size: 28px;
-
-        svg {
-            font-size: 36px;
-        }
-    }
+	font-size: 32px;
+	color: $brand-dark;
+	font-weight: 700;
+	margin-bottom: 43px;
+
+	svg {
+		font-size: 42px;
+		margin-right: 28px;
+	}
+
+	@media (max-width: $screen-md) {
+		font-size: 28px;
+
+		svg {
+			font-size: 36px;
+		}
+	}
 }
 
 .title-section.orange {
-    color: #ff8f39;
+	color: #ff8f39;
 }
 
 .title-section ~ .version-section {
-    margin-bottom: 26px;
+	margin-bottom: 26px;
 }
 
 .subtitle-section {
-    color: $brand-lighter;
-    font-size: 20px;
-    font-weight: 400;
-    margin: 0;
-
-    @media (max-width: $screen-md) {
-        font-size: 18px;
-    }
+	color: $brand-lighter;
+	font-size: 20px;
+	font-weight: 400;
+	margin: 0;
+
+	@media (max-width: $screen-md) {
+		font-size: 18px;
+	}
 }
 
 .version-section {
-    color: $brand-lighter;
-    font-size: 24px;
-    font-weight: 500;
+	color: $brand-lighter;
+	font-size: 24px;
+	font-weight: 500;
 }
 
 .code-shell {
-    color: #ffae9a;
-    display: inline-block;
-    font-size: 18px;
-    font-weight: 600;
+	color: #ffae9a;
+	display: inline-block;
+	font-size: 18px;
+	font-weight: 600;
 }
 
 .spacing {
-    padding: 141px 20px;
+	padding: 141px 20px;
 }
 
 .hr {
-    &:first-child::before,
-    &::before {
-        background-color: $brand-bg-dark-lighter;
-        content: "";
-        display: block;
-        height: 2px;
-        margin-left: auto;
-        margin-right: auto;
-        width: 300px;
-    }
+	&:first-child::before,
+	&::before {
+		background-color: $brand-bg-dark-lighter;
+		content: '';
+		display: block;
+		height: 2px;
+		margin-left: auto;
+		margin-right: auto;
+		width: 300px;
+	}
 }
 
 .warning {
-    .subtitle-section {
-        color: #fff4ec;
-        margin-bottom: 61px;
-    }
-
-    .btn-borderless {
-        border-color: #fff4ec;
-    }
-
-    .btn-warning-borderless {
-        color: #fff4ec;
-    }
-
-    .btn-brand-color {
-        color: #fff4ec;
-    }
+	.subtitle-section {
+		color: #fff4ec;
+		margin-bottom: 61px;
+	}
+
+	.btn-borderless {
+		border-color: #fff4ec;
+	}
+
+	.btn-warning-borderless {
+		color: #fff4ec;
+	}
+
+	.btn-brand-color {
+		color: #fff4ec;
+	}
 }
 
 .components {
-    .subtitle-section {
-        margin-bottom: 61px;
-    }
+	.subtitle-section {
+		margin-bottom: 61px;
+	}
 
-    img {
-        margin-bottom: 30px;
-    }
+	img {
+		margin-bottom: 30px;
+	}
 }
 
 .css {
-    .title-section {
-        margin-bottom: 20px;
-    }
+	.title-section {
+		margin-bottom: 20px;
+	}
 
-    .subtitle-section {
-        margin-bottom: 44px;
-    }
+	.subtitle-section {
+		margin-bottom: 44px;
+	}
 
-    .code-shell {
-        margin-bottom: 46px;
-    }
+	.code-shell {
+		margin-bottom: 46px;
+	}
 }
 
 .css,
 .contribute {
-    .container-fluid {
-        @media (max-width: $screen-md) {
-            text-align: center !important;
-        }
-    }
+	.container-fluid {
+		@media (max-width: $screen-md) {
+			text-align: center !important;
+		}
+	}
 }
 
 .contribute {
-    color: #272833;
-    background-color: $brand-lighter;
-    padding: 153px 0;
-
-    h2 {
-        font-size: 34px;
-        font-weight: 700;
-        margin-bottom: 14px;
-    }
-
-    p {
-        font-size: 24px;
-        font-weight: 600;
-        line-height: 1.4;
-        margin-bottom: 23px;
-    }
-
-    .btn-dark {
-        color: $brand-lighter;
-    }
+	color: #272833;
+	background-color: $brand-lighter;
+	padding: 153px 0;
+
+	h2 {
+		font-size: 34px;
+		font-weight: 700;
+		margin-bottom: 14px;
+	}
+
+	p {
+		font-size: 24px;
+		font-weight: 600;
+		line-height: 1.4;
+		margin-bottom: 23px;
+	}
+
+	.btn-dark {
+		color: $brand-lighter;
+	}
 }
 
 .link-blocks {
-    color: $brand-light;
-    padding: 80px 0;
-
-    @include media-breakpoint-up(sm) {
-        padding: 128px 0;
-    }
-
-    .card {
-        background-color: #2B2D39;
-        border-width: 0;
-        box-shadow: 4px 6px 24px rgba(30, 31, 39, 0.3);
-
-        &:hover {
-            background-color: #272833;
-
-            a {
-                color: #D2D3DD;
-            }
-        }
-
-        img.mx-auto {
-            height: 60px;
-            margin: 32px 0 40px;
-        }
-
-        a {
-            color: #545462;
-            font-weight: bold;
-        }
-    }
-}
\ No newline at end of file
+	color: $brand-light;
+	padding: 80px 0;
+
+	@include media-breakpoint-up(sm) {
+		padding: 128px 0;
+	}
+
+	.card {
+		background-color: #2b2d39;
+		border-width: 0;
+		box-shadow: 4px 6px 24px rgba(30, 31, 39, 0.3);
+
+		&:hover {
+			background-color: #272833;
+
+			a {
+				color: #d2d3dd;
+			}
+		}
+
+		img.mx-auto {
+			height: 60px;
+			margin: 32px 0 40px;
+		}
+
+		a {
+			color: #545462;
+			font-weight: bold;
+		}
+	}
+}
diff --git a/clayui.com/src/styles/_mixin.scss b/clayui.com/src/styles/_mixin.scss
index b6392c208b..e4299c53f2 100644
--- a/clayui.com/src/styles/_mixin.scss
+++ b/clayui.com/src/styles/_mixin.scss
@@ -1,9 +1,10 @@
 @mixin focus-a11y {
 	border-radius: 0.25rem;
-	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
+		border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
 
 	&:focus {
-		box-shadow: 0 0 0 0.125rem #FFF, 0 0 0 0.25rem #80ACFF;
+		box-shadow: 0 0 0 0.125rem #fff, 0 0 0 0.25rem #80acff;
 		outline: 0;
 	}
 }
diff --git a/clayui.com/src/styles/_navbar.scss b/clayui.com/src/styles/_navbar.scss
index 85b01fd7d0..c60bcd209c 100644
--- a/clayui.com/src/styles/_navbar.scss
+++ b/clayui.com/src/styles/_navbar.scss
@@ -79,7 +79,7 @@
 	min-height: $base-size * 2.92;
 	position: relative;
 	z-index: 100;
-	border-top: 1px solid rgba(0,0,0,.1);
+	border-top: 1px solid rgba(0, 0, 0, 0.1);
 
 	@media (min-width: $grid-float-breakpoint) {
 		display: none;
@@ -112,4 +112,4 @@
 	.lexicon-icon {
 		font-size: 11px;
 	}
-}
\ No newline at end of file
+}
diff --git a/clayui.com/src/styles/_sidebar.scss b/clayui.com/src/styles/_sidebar.scss
index e2d6e471f5..10d5e08529 100644
--- a/clayui.com/src/styles/_sidebar.scss
+++ b/clayui.com/src/styles/_sidebar.scss
@@ -83,4 +83,4 @@
 		height: 100vh;
 		flex-shrink: 0;
 	}
-}
\ No newline at end of file
+}
diff --git a/clayui.com/src/styles/main.scss b/clayui.com/src/styles/main.scss
index 15095dc620..e5e4c46b86 100644
--- a/clayui.com/src/styles/main.scss
+++ b/clayui.com/src/styles/main.scss
@@ -1,20 +1,20 @@
-@import "atlas-variables";
-@import "charts";
+@import 'atlas-variables';
+@import 'charts';
 
-@import "site/variables";
-@import "mixin";
+@import 'site/variables';
+@import 'mixin';
 
-@import "autocomplete";
-@import "code";
-@import "docsearch";
-@import "footer";
-@import "guide";
-@import "blog";
-@import "landing";
-@import "navbar";
-@import "prismjs";
-@import "sidebar";
+@import 'autocomplete';
+@import 'code';
+@import 'docsearch';
+@import 'footer';
+@import 'guide';
+@import 'blog';
+@import 'landing';
+@import 'navbar';
+@import 'prismjs';
+@import 'sidebar';
 
-@import "site/site";
-@import "site/content-site";
-@import "site/sidebar-site";
+@import 'site/site';
+@import 'site/content-site';
+@import 'site/sidebar-site';
diff --git a/clayui.com/src/styles/site/_content-site.scss b/clayui.com/src/styles/site/_content-site.scss
index 5c212d7d31..8527199c4b 100644
--- a/clayui.com/src/styles/site/_content-site.scss
+++ b/clayui.com/src/styles/site/_content-site.scss
@@ -83,8 +83,9 @@
 	// Cards
 
 	.clay-site-vertical-card {
-		.card-header, .card-footer {
-			background: #EEE;
+		.card-header,
+		.card-footer {
+			background: #eee;
 			padding-bottom: 5px;
 			padding-top: 5px;
 		}
@@ -128,15 +129,15 @@
 	}
 
 	.form-container {
-		background-color: #FFF;
-		border: 1px solid #E8E8EC;
+		background-color: #fff;
+		border: 1px solid #e8e8ec;
 		border-radius: 0.25rem;
 		padding: 1.5rem;
 	}
 
 	// Icons
 
-	$site-lexicon-icon-color: #5AF;
+	$site-lexicon-icon-color: #5af;
 
 	.clay-site-svg-bg {
 		background-repeat: no-repeat;
@@ -180,7 +181,9 @@
 	}
 
 	.clay-site-linux-tux {
-		background-image: clay-svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://web.resource.org/cc/" width="500pt" height="600pt"><defs><linearGradient id="linearGradient172"><stop style="stop-color:#3f2600;stop-opacity:0.6;" offset="0" id="stop173"/><stop style="stop-color:#3f2600;stop-opacity:0;" offset="1" id="stop174"/></linearGradient><linearGradient id="linearGradient167"><stop style="stop-color:#ffffff;stop-opacity:0.65;" offset="0" id="stop168"/><stop style="stop-color:#ffffff;stop-opacity:0;" offset="1" id="stop169"/></linearGradient><linearGradient id="linearGradient162"><stop style="stop-color:#ffa63f;stop-opacity:1;" offset="0" id="stop163"/><stop style="stop-color:#ffff00;stop-opacity:1;" offset="1" id="stop164"/></linearGradient><linearGradient id="linearGradient153"><stop style="stop-color:#ffeed7;stop-opacity:1;" offset="0" id="stop154"/><stop style="stop-color:#bdbfc2;stop-opacity:1;" offset="1" id="stop155"/></linearGradient><linearGradient id="linearGradient138"><stop style="stop-color:#ffffff;stop-opacity:0.8;" offset="0" id="stop139"/><stop style="stop-color:#ffffff;stop-opacity:0;" offset="1" id="stop140"/></linearGradient><linearGradient xlink:href="#linearGradient138" id="linearGradient141" x1="0.47424799" y1="0.020191999" x2="0.417539" y2="0.90125799" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient142" x1="0.55880702" y1="0.031192999" x2="0.553922" y2="0.94531101" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient143" x1="0.46557701" y1="0.028819799" x2="0.41365999" y2="0.93366498" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient144" x1="0.70346397" y1="0.059404202" x2="0.64553201" y2="0.94063401" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient145" x1="0.46741399" y1="-0.036155298" x2="0.86741799" y2="0.75857902" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient146" x1="0.57152498" y1="0.023441499" x2="0.57143003" y2="0.71875" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient147" x1="0.5" y1="0.0234362" x2="0.5" y2="0.8125" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient148" x1="0.50799799" y1="0.37435901" x2="0.51599997" y2="0.92820501" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient138" id="linearGradient149" x1="0.5" y1="0.131707" x2="0.50400001" y2="0.94634098" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient150" x1="-0.30509499" y1="0.099496603" x2="0.156323" y2="0.94191301" gradientUnits="objectBoundingBox" gradientTransform="matrix(-0.928523,0.283938,0.435332,0.943857,-1.91327e-7,5.49908e-8)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient151" x1="0.433979" y1="0.022184599" x2="0.487055" y2="1.02569" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient152" x1="0.5" y1="0.89842999" x2="0.5" y2="0.40625" gradientUnits="objectBoundingBox" spreadMethod="reflect"/><linearGradient xlink:href="#linearGradient153" id="linearGradient156" x1="0.43568701" y1="0.98882002" x2="0.453989" y2="0.23093501" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient157" x1="0.49180499" y1="1.15284" x2="0.49482101" y2="0.41252401" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient158" x1="0.51730198" y1="0.85418499" x2="0.49843901" y2="0.136172" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient159" x1="0.46201" y1="0.87917101" x2="0.49215299" y2="0.096282303" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient161" x1="0.50086302" y1="0.34872901" x2="0.41209599" y2="0.98558098" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient165" x1="0.60399801" y1="0.51020199" x2="0.46399999" y2="0.98367399" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient166" x1="0.50000501" y1="0.191616" x2="0.50800002" y2="0.97005898" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient171" cx="0.5" cy="0.5" fx="0.5" fy="0.5" r="0.5" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient176"/><linearGradient xlink:href="#linearGradient153" id="linearGradient178" x1="0.94027299" y1="1.2934099" x2="0.19452" y2="-0.675295" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient1399" gradientTransform="scale(1.045233,0.956725)" cx="446.77762" cy="1219.4125" fx="446.77762" fy="1219.4125" r="195.07191" gradientUnits="userSpaceOnUse"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1401" gradientUnits="userSpaceOnUse" x1="400.57785" y1="369.53015" x2="400.84448" y2="304.07886" gradientTransform="scale(0.575262,1.738339)"/><linearGradient xlink:href="#linearGradient138" id="linearGradient1403" gradientUnits="userSpaceOnUse" x1="303.01761" y1="237.93179" x2="297.0856" y2="330.09561" gradientTransform="scale(1.116071,0.896001)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1405" gradientUnits="userSpaceOnUse" gradientTransform="scale(0.816497,1.224744)" x1="378.93771" y1="278.60202" x2="380.27319" y2="243.91606"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1407" gradientUnits="userSpaceOnUse" x1="381.38742" y1="277.495" x2="380.5517" y2="245.68338" gradientTransform="scale(0.816497,1.224744)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1409" gradientUnits="userSpaceOnUse" gradientTransform="scale(0.816497,1.224744)" x1="379.09573" y1="240.92712" x2="376.79556" y2="281.01636"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1411" gradientUnits="userSpaceOnUse" x1="389.63535" y1="242.28218" x2="387.06866" y2="281.32513" gradientTransform="scale(0.816497,1.224744)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1413" gradientUnits="userSpaceOnUse" spreadMethod="reflect" x1="437.57941" y1="528.87177" x2="437.57941" y2="394.10361" gradientTransform="scale(0.812855,1.230232)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1415" gradientUnits="userSpaceOnUse" x1="375.17325" y1="419.78485" x2="377.48541" y2="324.03815" gradientTransform="scale(0.649784,1.538974)"/><linearGradient xlink:href="#linearGradient138" id="linearGradient1417" gradientUnits="userSpaceOnUse" x1="320.75104" y1="498.17776" x2="321.32224" y2="614.50439" gradientTransform="scale(1.074798,0.930408)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1419" gradientUnits="userSpaceOnUse" x1="322.48257" y1="435.26761" x2="323.2514" y2="488.48251" gradientTransform="scale(1.077001,0.928504)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1421" gradientUnits="userSpaceOnUse" x1="411.2215" y1="242.94365" x2="411.2215" y2="331.44858" gradientTransform="scale(0.571707,1.749147)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1423" gradientUnits="userSpaceOnUse" x1="867.34546" y1="234.73897" x2="867.33453" y2="314.83911" gradientTransform="scale(0.572667,1.746214)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1425" gradientUnits="userSpaceOnUse" x1="236.25362" y1="657.11133" x2="212.5099" y2="737.41229" gradientTransform="scale(1.011514,0.988617)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1427" gradientUnits="userSpaceOnUse" x1="381.56607" y1="655.73102" x2="279.64313" y2="386.66583" gradientTransform="scale(1.065499,0.938527)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1429" gradientUnits="userSpaceOnUse" x1="218.11714" y1="630.30475" x2="203.12654" y2="737.8537" gradientTransform="scale(1.009851,0.990245)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1431" gradientUnits="userSpaceOnUse" gradientTransform="scale(1.007724,0.992335)" x1="117.88966" y1="587.23602" x2="182.24524" y2="704.73077"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1433" gradientUnits="userSpaceOnUse" x1="223.10072" y1="570.41809" x2="230.53499" y2="710.97723" gradientTransform="scale(0.999504,1.000496)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1435" gradientUnits="userSpaceOnUse" x1="316.93988" y1="474.01779" x2="371.60889" y2="582.63507" gradientTransform="scale(1.065499,0.938527)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1437" gradientUnits="userSpaceOnUse" x1="284.68652" y1="410.46326" x2="285.45923" y2="485.69934" gradientTransform="scale(1.218684,0.820557)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1439" gradientUnits="userSpaceOnUse" x1="288.82358" y1="398.85422" x2="288.37628" y2="482.55939" gradientTransform="scale(1.221941,0.81837)"/></defs><g id="g1369" transform="translate(-310.7524,-64.25268)"><path transform="matrix(1.4177,0,0,0.414745,-38.7944,222.194)" d="M 670.88202 1166.6423 A 203.89551 186.63016 0 1 1 263.091,1166.6423 A 203.89551 186.63016 0 1 1 670.88202 1166.6423 z" id="path175" style="fill:url(#radialGradient1399);stroke:none;stroke-width:1pt;stroke-linecap:butt;stroke-linejoin:miter"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path106" d="M 223.627,632.24 C 201.239,600.017 196.873,495.256 249.114,430.81 C 275,399.892 281.604,378.345 283.645,349.417 C 285.034,316.438 260.32,217.975 353.528,210.473 C 447.934,202.941 442.864,296.133 442.321,345.448 C 441.87,387.088 472.895,410.689 494.117,443.143 C 533.396,502.773 530.074,605.443 486.718,661.015 C 431.801,730.583 384.765,700.413 353.528,702.945 C 295.035,706.147 293.101,737.336 223.627,632.24 z " style="fill:#000000;stroke:none;stroke-width:1.25;"/><path transform="matrix(-1.67739,-2.24516e-2,-2.11236e-2,1.4709,1173.58,-293.017)" id="path113" d="M 246.571,470.864 C 234.332,483.36 202.175,539.956 251.44,576.224 C 268.809,588.857 235.063,635.719 219.435,612.532 C 191.865,570.914 210.604,505.591 227.75,482.344 C 239.402,465.857 256.98,459.668 246.571,470.864 z " style="fill:url(#linearGradient1401);stroke:none;stroke-width:0.99464899;"/><path transform="matrix(-1.67755,0,0,1.52374,1174.62,-318.082)" id="path111" d="M 256.513,459.837 C 236.598,477.554 200.337,539.928 253.225,580.443 C 270.595,593.075 237.832,632.906 219.435,612.532 C 155.472,541.712 221.104,460.278 243.697,432.282 C 263.889,407.935 281.775,438.034 256.513,459.837 z " style="fill:#000000;stroke:#000000;stroke-width:0.97729802;"/><path transform="matrix(1.26626,-7.13667e-2,-4.59795e-2,1.19574,202.143,-125.761)" d="M 399.56879 258.15753 A 58.37323 46.863022 0 1 1 282.82233,258.15753 A 58.37323 46.863022 0 1 1 399.56879 258.15753 z" id="path114" style="fill:url(#linearGradient1403);stroke:none;stroke-width:1.26498997;"/><path transform="matrix(1.30445,-7.55326e-2,7.71251e-2,1.34257,144.757,-177.617)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path115" style="fill:url(#linearGradient1405);stroke:none;stroke-width:1.17873001;"/><path transform="matrix(-1.81082,4.95107e-2,3.17324e-2,1.55333,1207.46,-284.777)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path116" style="fill:url(#linearGradient1407);stroke:none;stroke-width:0.93138498;"/><path transform="matrix(-0.823196,-1.76123e-3,-1.82321e-2,0.852662,913.674,-37.9902)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path117" style="fill:#000000;stroke:none;stroke-width:1.86495996;"/><path transform="matrix(0.59438,-7.22959e-2,6.88176e-2,0.705838,367.448,32.4186)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path118" style="fill:#000000;stroke:none;stroke-width:2.39814997;"/><path transform="matrix(-0.480323,-3.6454e-2,-4.67935e-2,0.475606,813.496,87.0124)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path121" style="fill:url(#linearGradient1409);stroke:none;stroke-width:3.1916101;"/><path transform="matrix(0.35691,-4.08211e-2,4.13232e-2,0.398544,449.334,114.991)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path122" style="fill:url(#linearGradient1411);stroke:none;stroke-width:4.12025976;"/><path transform="matrix(1.25,0,0,1.25,185.454,-168.23)" id="path128" d="M 258.702,495.425 C 271.538,466.322 298.816,415.199 299.397,375.667 C 299.397,344.225 393.576,336.716 401.134,368.109 C 408.692,399.502 427.875,446.592 440.084,469.265 C 452.292,491.937 487.893,563.96 449.968,626.811 C 415.811,682.455 312.243,726.477 256.958,619.254 C 238.355,582.047 241.673,535.939 258.702,495.425 z " style="fill:url(#linearGradient1413);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.38936,-0.111074,0.102211,1.30214,108.413,-165.938)" id="path112" d="M 242.905,473.815 C 231.642,492.782 207.405,543.124 255.042,575.862 C 306.353,610.682 301.515,672.924 239.435,637.817 C 182.658,606.028 216.59,500.039 234.925,475.551 C 247.032,458.337 264.822,437.52 242.905,473.815 z " style="fill:url(#linearGradient1415);stroke:none;stroke-width:1.15804005;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path109" d="M 256.513,449.72 C 239.048,478.228 197.136,545.533 253.225,580.443 C 328.794,626.798 307.398,673.154 238.426,631.417 C 141.317,573.153 226.601,455.801 265.557,411.079 C 310.001,360.879 274.111,420.166 256.513,449.72 z " style="fill:#000000;stroke:#000000;stroke-width:1.25;"/><path id="path125" d="M 421.481,504.727 C 421.481,537.139 392.209,579.243 341.953,578.865 C 290.125,579.32 268.004,537.139 268.004,504.727 C 268.004,472.315 302.383,446.01 344.743,446.01 C 387.102,446.01 421.481,472.315 421.481,504.727 z " style="font-size:12px;fill:url(#linearGradient1417);stroke:none;stroke-width:1.23705006;stroke-dasharray:none" transform="matrix(1.30209,0,0,1.22525,170.042,-153.557)"/><path id="path127" d="M 398.227,412.292 C 397.615,450.864 375.047,459.963 346.487,459.963 C 317.926,459.963 297.195,454.269 294.746,412.292 C 294.746,385.978 317.926,370.75 346.487,370.75 C 375.047,370.75 398.227,385.978 398.227,412.292 z " style="font-size:12px;fill:url(#linearGradient1419);stroke:none;stroke-width:1.38846004;stroke-dasharray:none" transform="matrix(1.1868,0,0,1.06708,210.623,-100.078)"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path129" d="M 234.285,456.475 C 252.001,429.479 289.3,388.111 241.262,462.288 C 202.311,523.331 226.859,562.561 239.518,573.327 C 276.045,605.889 274.484,627.676 245.913,610.533 C 184.288,573.907 197.078,512.285 234.285,456.475 z " style="fill:url(#linearGradient1421);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path131" d="M 490.662,467.52 C 475.343,435.819 426.528,355.618 492.988,448.917 C 553.449,533.214 511.01,591.93 503.452,597.744 C 495.895,603.557 470.315,615.184 477.873,594.837 C 485.43,574.49 523.107,535.864 490.662,467.52 z " style="fill:url(#linearGradient1423);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path132" d="M 220.915,716.921 C 180.473,695.505 121.663,721.045 143.013,662.855 C 147.289,649.617 136.638,629.847 143.594,616.929 C 151.733,601.231 169.174,604.72 179.639,594.255 C 189.957,583.364 196.498,564.606 215.683,567.513 C 234.867,570.42 247.628,593.974 261.027,622.742 C 270.91,643.38 305.968,672.406 303.677,695.5 C 300.981,731 260.65,737.69 220.915,716.921 z " style="fill:url(#linearGradient1425);stroke:#e68c3f;stroke-width:6.25;"/><path id="path177" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:url(#linearGradient1427);stroke:none;stroke-width:2.85509992;stroke-dasharray:none" transform="matrix(0.598206,0.268584,-0.239623,0.617213,700.568,140.464)"/><path transform="matrix(-1.1685,0.423145,0.475283,1.16478,728.343,-213.821)" id="path133" d="M 220.274,718.402 C 178.947,694.812 120.38,724.007 143.013,662.855 C 147.749,649.787 136.417,629.303 143.373,616.385 C 151.512,600.687 169.174,604.72 179.639,594.255 C 189.957,583.364 198.466,566.387 217.651,569.294 C 236.835,572.201 247.628,593.974 261.027,622.742 C 270.91,643.38 304.442,671.713 302.151,694.807 C 299.455,730.307 259.427,740.278 220.274,718.402 z " style="fill:url(#linearGradient1429);stroke:#e68c3f;stroke-width:6.25067997;"/><path transform="matrix(-0.945096,0.343745,0.424076,0.956058,714.328,-64.342)" id="path134" d="M 216.482,675.68 C 129.951,618.177 169.174,604.72 179.639,594.255 C 189.957,583.364 198.466,566.387 217.651,569.294 C 236.835,572.201 247.628,593.974 261.027,622.742 C 270.91,643.38 304.087,671.66 302.151,694.807 C 299.535,721.917 253.961,700.294 216.482,675.68 z " style="fill:url(#linearGradient1431);stroke:none;stroke-width:1.52532005;"/><path transform="matrix(1.00431,-5.2286e-2,-1.74e-2,1.04575,244.191,-28.4653)" id="path135" d="M 216.506,677.071 C 129.975,619.568 169.709,603.501 182.56,595.791 C 197.959,585.849 197.718,564.96 216.903,567.867 C 236.087,570.774 247.628,593.974 261.027,622.742 C 270.91,643.38 304.087,671.66 302.151,694.807 C 299.535,721.917 253.985,701.685 216.506,677.071 z " style="fill:url(#linearGradient1433);stroke:none;stroke-width:1.52532005;"/><path id="path136" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:#000000;stroke:none;stroke-width:2.85509992;" transform="matrix(0.515584,0.215259,-0.206526,0.49467,713.3,222.559)"/><path id="path137" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:url(#linearGradient1435);stroke:none;stroke-width:2.85509992;" transform="matrix(0.351231,0.149463,-0.128856,0.343469,724.522,318.291)"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path119" d="M 309.954,338.729 C 317.101,331.959 334.765,311.663 367.915,332.974 C 374.077,336.984 379.077,337.351 390.936,342.429 C 414.662,352.178 403.318,375.688 378.192,383.537 C 367.434,387.026 357.656,400.093 338.063,398.976 C 321.329,397.999 316.944,387.102 306.665,381.07 C 288.396,370.759 285.7,356.816 295.565,349.417 C 305.431,342.018 309.29,339.358 309.954,338.729 z " style="fill:url(#linearGradient1437);stroke:#e68c3f;stroke-width:3.75;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path120" d="M 391.251,357.645 C 381.368,358.226 359.858,379.736 337.185,379.736 C 314.512,379.736 301.141,358.807 297.653,358.807" style="fill:none;stroke:#e68c3f;stroke-width:2.5;"/><path transform="matrix(0.627885,0,0,0.595666,392.366,51.8173)" id="path123" d="M 309.954,338.729 C 317.101,331.959 339.645,313.381 369.542,332.401 C 375.841,336.167 382.346,340.266 392.02,345.865 C 411.182,357.613 401.691,374.543 378.734,385.255 C 368.316,389.75 351.141,399.67 338.063,398.976 C 323.53,397.568 314.128,387.577 304.496,381.07 C 286.826,368.767 287.899,358.833 296.107,350.562 C 302.312,344.883 309.29,339.358 309.954,338.729 z " style="fill:url(#linearGradient1439);stroke:none;"/></g></svg>');
+		background-image: clay-svg-url(
+			'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://web.resource.org/cc/" width="500pt" height="600pt"><defs><linearGradient id="linearGradient172"><stop style="stop-color:#3f2600;stop-opacity:0.6;" offset="0" id="stop173"/><stop style="stop-color:#3f2600;stop-opacity:0;" offset="1" id="stop174"/></linearGradient><linearGradient id="linearGradient167"><stop style="stop-color:#ffffff;stop-opacity:0.65;" offset="0" id="stop168"/><stop style="stop-color:#ffffff;stop-opacity:0;" offset="1" id="stop169"/></linearGradient><linearGradient id="linearGradient162"><stop style="stop-color:#ffa63f;stop-opacity:1;" offset="0" id="stop163"/><stop style="stop-color:#ffff00;stop-opacity:1;" offset="1" id="stop164"/></linearGradient><linearGradient id="linearGradient153"><stop style="stop-color:#ffeed7;stop-opacity:1;" offset="0" id="stop154"/><stop style="stop-color:#bdbfc2;stop-opacity:1;" offset="1" id="stop155"/></linearGradient><linearGradient id="linearGradient138"><stop style="stop-color:#ffffff;stop-opacity:0.8;" offset="0" id="stop139"/><stop style="stop-color:#ffffff;stop-opacity:0;" offset="1" id="stop140"/></linearGradient><linearGradient xlink:href="#linearGradient138" id="linearGradient141" x1="0.47424799" y1="0.020191999" x2="0.417539" y2="0.90125799" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient142" x1="0.55880702" y1="0.031192999" x2="0.553922" y2="0.94531101" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient143" x1="0.46557701" y1="0.028819799" x2="0.41365999" y2="0.93366498" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient144" x1="0.70346397" y1="0.059404202" x2="0.64553201" y2="0.94063401" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient145" x1="0.46741399" y1="-0.036155298" x2="0.86741799" y2="0.75857902" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient146" x1="0.57152498" y1="0.023441499" x2="0.57143003" y2="0.71875" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient147" x1="0.5" y1="0.0234362" x2="0.5" y2="0.8125" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient148" x1="0.50799799" y1="0.37435901" x2="0.51599997" y2="0.92820501" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient138" id="linearGradient149" x1="0.5" y1="0.131707" x2="0.50400001" y2="0.94634098" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient150" x1="-0.30509499" y1="0.099496603" x2="0.156323" y2="0.94191301" gradientUnits="objectBoundingBox" gradientTransform="matrix(-0.928523,0.283938,0.435332,0.943857,-1.91327e-7,5.49908e-8)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient151" x1="0.433979" y1="0.022184599" x2="0.487055" y2="1.02569" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient152" x1="0.5" y1="0.89842999" x2="0.5" y2="0.40625" gradientUnits="objectBoundingBox" spreadMethod="reflect"/><linearGradient xlink:href="#linearGradient153" id="linearGradient156" x1="0.43568701" y1="0.98882002" x2="0.453989" y2="0.23093501" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient157" x1="0.49180499" y1="1.15284" x2="0.49482101" y2="0.41252401" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient158" x1="0.51730198" y1="0.85418499" x2="0.49843901" y2="0.136172" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient159" x1="0.46201" y1="0.87917101" x2="0.49215299" y2="0.096282303" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient161" x1="0.50086302" y1="0.34872901" x2="0.41209599" y2="0.98558098" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient165" x1="0.60399801" y1="0.51020199" x2="0.46399999" y2="0.98367399" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient166" x1="0.50000501" y1="0.191616" x2="0.50800002" y2="0.97005898" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient171" cx="0.5" cy="0.5" fx="0.5" fy="0.5" r="0.5" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient176"/><linearGradient xlink:href="#linearGradient153" id="linearGradient178" x1="0.94027299" y1="1.2934099" x2="0.19452" y2="-0.675295" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient1399" gradientTransform="scale(1.045233,0.956725)" cx="446.77762" cy="1219.4125" fx="446.77762" fy="1219.4125" r="195.07191" gradientUnits="userSpaceOnUse"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1401" gradientUnits="userSpaceOnUse" x1="400.57785" y1="369.53015" x2="400.84448" y2="304.07886" gradientTransform="scale(0.575262,1.738339)"/><linearGradient xlink:href="#linearGradient138" id="linearGradient1403" gradientUnits="userSpaceOnUse" x1="303.01761" y1="237.93179" x2="297.0856" y2="330.09561" gradientTransform="scale(1.116071,0.896001)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1405" gradientUnits="userSpaceOnUse" gradientTransform="scale(0.816497,1.224744)" x1="378.93771" y1="278.60202" x2="380.27319" y2="243.91606"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1407" gradientUnits="userSpaceOnUse" x1="381.38742" y1="277.495" x2="380.5517" y2="245.68338" gradientTransform="scale(0.816497,1.224744)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1409" gradientUnits="userSpaceOnUse" gradientTransform="scale(0.816497,1.224744)" x1="379.09573" y1="240.92712" x2="376.79556" y2="281.01636"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1411" gradientUnits="userSpaceOnUse" x1="389.63535" y1="242.28218" x2="387.06866" y2="281.32513" gradientTransform="scale(0.816497,1.224744)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1413" gradientUnits="userSpaceOnUse" spreadMethod="reflect" x1="437.57941" y1="528.87177" x2="437.57941" y2="394.10361" gradientTransform="scale(0.812855,1.230232)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1415" gradientUnits="userSpaceOnUse" x1="375.17325" y1="419.78485" x2="377.48541" y2="324.03815" gradientTransform="scale(0.649784,1.538974)"/><linearGradient xlink:href="#linearGradient138" id="linearGradient1417" gradientUnits="userSpaceOnUse" x1="320.75104" y1="498.17776" x2="321.32224" y2="614.50439" gradientTransform="scale(1.074798,0.930408)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1419" gradientUnits="userSpaceOnUse" x1="322.48257" y1="435.26761" x2="323.2514" y2="488.48251" gradientTransform="scale(1.077001,0.928504)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1421" gradientUnits="userSpaceOnUse" x1="411.2215" y1="242.94365" x2="411.2215" y2="331.44858" gradientTransform="scale(0.571707,1.749147)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1423" gradientUnits="userSpaceOnUse" x1="867.34546" y1="234.73897" x2="867.33453" y2="314.83911" gradientTransform="scale(0.572667,1.746214)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1425" gradientUnits="userSpaceOnUse" x1="236.25362" y1="657.11133" x2="212.5099" y2="737.41229" gradientTransform="scale(1.011514,0.988617)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1427" gradientUnits="userSpaceOnUse" x1="381.56607" y1="655.73102" x2="279.64313" y2="386.66583" gradientTransform="scale(1.065499,0.938527)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1429" gradientUnits="userSpaceOnUse" x1="218.11714" y1="630.30475" x2="203.12654" y2="737.8537" gradientTransform="scale(1.009851,0.990245)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1431" gradientUnits="userSpaceOnUse" gradientTransform="scale(1.007724,0.992335)" x1="117.88966" y1="587.23602" x2="182.24524" y2="704.73077"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1433" gradientUnits="userSpaceOnUse" x1="223.10072" y1="570.41809" x2="230.53499" y2="710.97723" gradientTransform="scale(0.999504,1.000496)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1435" gradientUnits="userSpaceOnUse" x1="316.93988" y1="474.01779" x2="371.60889" y2="582.63507" gradientTransform="scale(1.065499,0.938527)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1437" gradientUnits="userSpaceOnUse" x1="284.68652" y1="410.46326" x2="285.45923" y2="485.69934" gradientTransform="scale(1.218684,0.820557)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1439" gradientUnits="userSpaceOnUse" x1="288.82358" y1="398.85422" x2="288.37628" y2="482.55939" gradientTransform="scale(1.221941,0.81837)"/></defs><g id="g1369" transform="translate(-310.7524,-64.25268)"><path transform="matrix(1.4177,0,0,0.414745,-38.7944,222.194)" d="M 670.88202 1166.6423 A 203.89551 186.63016 0 1 1 263.091,1166.6423 A 203.89551 186.63016 0 1 1 670.88202 1166.6423 z" id="path175" style="fill:url(#radialGradient1399);stroke:none;stroke-width:1pt;stroke-linecap:butt;stroke-linejoin:miter"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path106" d="M 223.627,632.24 C 201.239,600.017 196.873,495.256 249.114,430.81 C 275,399.892 281.604,378.345 283.645,349.417 C 285.034,316.438 260.32,217.975 353.528,210.473 C 447.934,202.941 442.864,296.133 442.321,345.448 C 441.87,387.088 472.895,410.689 494.117,443.143 C 533.396,502.773 530.074,605.443 486.718,661.015 C 431.801,730.583 384.765,700.413 353.528,702.945 C 295.035,706.147 293.101,737.336 223.627,632.24 z " style="fill:#000000;stroke:none;stroke-width:1.25;"/><path transform="matrix(-1.67739,-2.24516e-2,-2.11236e-2,1.4709,1173.58,-293.017)" id="path113" d="M 246.571,470.864 C 234.332,483.36 202.175,539.956 251.44,576.224 C 268.809,588.857 235.063,635.719 219.435,612.532 C 191.865,570.914 210.604,505.591 227.75,482.344 C 239.402,465.857 256.98,459.668 246.571,470.864 z " style="fill:url(#linearGradient1401);stroke:none;stroke-width:0.99464899;"/><path transform="matrix(-1.67755,0,0,1.52374,1174.62,-318.082)" id="path111" d="M 256.513,459.837 C 236.598,477.554 200.337,539.928 253.225,580.443 C 270.595,593.075 237.832,632.906 219.435,612.532 C 155.472,541.712 221.104,460.278 243.697,432.282 C 263.889,407.935 281.775,438.034 256.513,459.837 z " style="fill:#000000;stroke:#000000;stroke-width:0.97729802;"/><path transform="matrix(1.26626,-7.13667e-2,-4.59795e-2,1.19574,202.143,-125.761)" d="M 399.56879 258.15753 A 58.37323 46.863022 0 1 1 282.82233,258.15753 A 58.37323 46.863022 0 1 1 399.56879 258.15753 z" id="path114" style="fill:url(#linearGradient1403);stroke:none;stroke-width:1.26498997;"/><path transform="matrix(1.30445,-7.55326e-2,7.71251e-2,1.34257,144.757,-177.617)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path115" style="fill:url(#linearGradient1405);stroke:none;stroke-width:1.17873001;"/><path transform="matrix(-1.81082,4.95107e-2,3.17324e-2,1.55333,1207.46,-284.777)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path116" style="fill:url(#linearGradient1407);stroke:none;stroke-width:0.93138498;"/><path transform="matrix(-0.823196,-1.76123e-3,-1.82321e-2,0.852662,913.674,-37.9902)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path117" style="fill:#000000;stroke:none;stroke-width:1.86495996;"/><path transform="matrix(0.59438,-7.22959e-2,6.88176e-2,0.705838,367.448,32.4186)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path118" style="fill:#000000;stroke:none;stroke-width:2.39814997;"/><path transform="matrix(-0.480323,-3.6454e-2,-4.67935e-2,0.475606,813.496,87.0124)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path121" style="fill:url(#linearGradient1409);stroke:none;stroke-width:3.1916101;"/><path transform="matrix(0.35691,-4.08211e-2,4.13232e-2,0.398544,449.334,114.991)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path122" style="fill:url(#linearGradient1411);stroke:none;stroke-width:4.12025976;"/><path transform="matrix(1.25,0,0,1.25,185.454,-168.23)" id="path128" d="M 258.702,495.425 C 271.538,466.322 298.816,415.199 299.397,375.667 C 299.397,344.225 393.576,336.716 401.134,368.109 C 408.692,399.502 427.875,446.592 440.084,469.265 C 452.292,491.937 487.893,563.96 449.968,626.811 C 415.811,682.455 312.243,726.477 256.958,619.254 C 238.355,582.047 241.673,535.939 258.702,495.425 z " style="fill:url(#linearGradient1413);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.38936,-0.111074,0.102211,1.30214,108.413,-165.938)" id="path112" d="M 242.905,473.815 C 231.642,492.782 207.405,543.124 255.042,575.862 C 306.353,610.682 301.515,672.924 239.435,637.817 C 182.658,606.028 216.59,500.039 234.925,475.551 C 247.032,458.337 264.822,437.52 242.905,473.815 z " style="fill:url(#linearGradient1415);stroke:none;stroke-width:1.15804005;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path109" d="M 256.513,449.72 C 239.048,478.228 197.136,545.533 253.225,580.443 C 328.794,626.798 307.398,673.154 238.426,631.417 C 141.317,573.153 226.601,455.801 265.557,411.079 C 310.001,360.879 274.111,420.166 256.513,449.72 z " style="fill:#000000;stroke:#000000;stroke-width:1.25;"/><path id="path125" d="M 421.481,504.727 C 421.481,537.139 392.209,579.243 341.953,578.865 C 290.125,579.32 268.004,537.139 268.004,504.727 C 268.004,472.315 302.383,446.01 344.743,446.01 C 387.102,446.01 421.481,472.315 421.481,504.727 z " style="font-size:12px;fill:url(#linearGradient1417);stroke:none;stroke-width:1.23705006;stroke-dasharray:none" transform="matrix(1.30209,0,0,1.22525,170.042,-153.557)"/><path id="path127" d="M 398.227,412.292 C 397.615,450.864 375.047,459.963 346.487,459.963 C 317.926,459.963 297.195,454.269 294.746,412.292 C 294.746,385.978 317.926,370.75 346.487,370.75 C 375.047,370.75 398.227,385.978 398.227,412.292 z " style="font-size:12px;fill:url(#linearGradient1419);stroke:none;stroke-width:1.38846004;stroke-dasharray:none" transform="matrix(1.1868,0,0,1.06708,210.623,-100.078)"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path129" d="M 234.285,456.475 C 252.001,429.479 289.3,388.111 241.262,462.288 C 202.311,523.331 226.859,562.561 239.518,573.327 C 276.045,605.889 274.484,627.676 245.913,610.533 C 184.288,573.907 197.078,512.285 234.285,456.475 z " style="fill:url(#linearGradient1421);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path131" d="M 490.662,467.52 C 475.343,435.819 426.528,355.618 492.988,448.917 C 553.449,533.214 511.01,591.93 503.452,597.744 C 495.895,603.557 470.315,615.184 477.873,594.837 C 485.43,574.49 523.107,535.864 490.662,467.52 z " style="fill:url(#linearGradient1423);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path132" d="M 220.915,716.921 C 180.473,695.505 121.663,721.045 143.013,662.855 C 147.289,649.617 136.638,629.847 143.594,616.929 C 151.733,601.231 169.174,604.72 179.639,594.255 C 189.957,583.364 196.498,564.606 215.683,567.513 C 234.867,570.42 247.628,593.974 261.027,622.742 C 270.91,643.38 305.968,672.406 303.677,695.5 C 300.981,731 260.65,737.69 220.915,716.921 z " style="fill:url(#linearGradient1425);stroke:#e68c3f;stroke-width:6.25;"/><path id="path177" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:url(#linearGradient1427);stroke:none;stroke-width:2.85509992;stroke-dasharray:none" transform="matrix(0.598206,0.268584,-0.239623,0.617213,700.568,140.464)"/><path transform="matrix(-1.1685,0.423145,0.475283,1.16478,728.343,-213.821)" id="path133" d="M 220.274,718.402 C 178.947,694.812 120.38,724.007 143.013,662.855 C 147.749,649.787 136.417,629.303 143.373,616.385 C 151.512,600.687 169.174,604.72 179.639,594.255 C 189.957,583.364 198.466,566.387 217.651,569.294 C 236.835,572.201 247.628,593.974 261.027,622.742 C 270.91,643.38 304.442,671.713 302.151,694.807 C 299.455,730.307 259.427,740.278 220.274,718.402 z " style="fill:url(#linearGradient1429);stroke:#e68c3f;stroke-width:6.25067997;"/><path transform="matrix(-0.945096,0.343745,0.424076,0.956058,714.328,-64.342)" id="path134" d="M 216.482,675.68 C 129.951,618.177 169.174,604.72 179.639,594.255 C 189.957,583.364 198.466,566.387 217.651,569.294 C 236.835,572.201 247.628,593.974 261.027,622.742 C 270.91,643.38 304.087,671.66 302.151,694.807 C 299.535,721.917 253.961,700.294 216.482,675.68 z " style="fill:url(#linearGradient1431);stroke:none;stroke-width:1.52532005;"/><path transform="matrix(1.00431,-5.2286e-2,-1.74e-2,1.04575,244.191,-28.4653)" id="path135" d="M 216.506,677.071 C 129.975,619.568 169.709,603.501 182.56,595.791 C 197.959,585.849 197.718,564.96 216.903,567.867 C 236.087,570.774 247.628,593.974 261.027,622.742 C 270.91,643.38 304.087,671.66 302.151,694.807 C 299.535,721.917 253.985,701.685 216.506,677.071 z " style="fill:url(#linearGradient1433);stroke:none;stroke-width:1.52532005;"/><path id="path136" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:#000000;stroke:none;stroke-width:2.85509992;" transform="matrix(0.515584,0.215259,-0.206526,0.49467,713.3,222.559)"/><path id="path137" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:url(#linearGradient1435);stroke:none;stroke-width:2.85509992;" transform="matrix(0.351231,0.149463,-0.128856,0.343469,724.522,318.291)"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path119" d="M 309.954,338.729 C 317.101,331.959 334.765,311.663 367.915,332.974 C 374.077,336.984 379.077,337.351 390.936,342.429 C 414.662,352.178 403.318,375.688 378.192,383.537 C 367.434,387.026 357.656,400.093 338.063,398.976 C 321.329,397.999 316.944,387.102 306.665,381.07 C 288.396,370.759 285.7,356.816 295.565,349.417 C 305.431,342.018 309.29,339.358 309.954,338.729 z " style="fill:url(#linearGradient1437);stroke:#e68c3f;stroke-width:3.75;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path120" d="M 391.251,357.645 C 381.368,358.226 359.858,379.736 337.185,379.736 C 314.512,379.736 301.141,358.807 297.653,358.807" style="fill:none;stroke:#e68c3f;stroke-width:2.5;"/><path transform="matrix(0.627885,0,0,0.595666,392.366,51.8173)" id="path123" d="M 309.954,338.729 C 317.101,331.959 339.645,313.381 369.542,332.401 C 375.841,336.167 382.346,340.266 392.02,345.865 C 411.182,357.613 401.691,374.543 378.734,385.255 C 368.316,389.75 351.141,399.67 338.063,398.976 C 323.53,397.568 314.128,387.577 304.496,381.07 C 286.826,368.767 287.899,358.833 296.107,350.562 C 302.312,344.883 309.29,339.358 309.954,338.729 z " style="fill:url(#linearGradient1439);stroke:none;"/></g></svg>'
+		);
 		height: 50px;
 		padding-left: 50px;
 		padding-top: 10px;
@@ -222,11 +225,11 @@
 
 		.lexicon-icon-asterisk {
 			fill-opacity: 0;
-			stroke: #078DD8;
+			stroke: #078dd8;
 			stroke-width: 10px;
 
 			&:hover {
-				fill: #078DD8;
+				fill: #078dd8;
 				fill-opacity: 1;
 				stroke: #000;
 				stroke-opacity: 0.3;
@@ -235,9 +238,9 @@
 		}
 
 		.lexicon-icon-logout {
-			fill: #DA3A35;
+			fill: #da3a35;
 			fill-opacity: 1;
-			stroke: #FFF;
+			stroke: #fff;
 			stroke-width: 55px;
 
 			&:hover {
@@ -264,15 +267,16 @@
 		}
 
 		.lexicon-icon-exclamation-full {
-			fill: #E3A200;
-			stroke: #FFF;
+			fill: #e3a200;
+			stroke: #fff;
 			stroke-opacity: 0.4;
 			stroke-width: 40px;
 
 			&:hover {
-				animation: exclamationHover 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+				animation: exclamationHover 0.25s
+					cubic-bezier(0.175, 0.885, 0.32, 1.275);
 				animation-fill-mode: both;
-				fill: #EC297B;
+				fill: #ec297b;
 			}
 		}
 	}
@@ -426,69 +430,69 @@
 	}
 
 	$swatches: (
-		'black':			$black,
-		'gray-900':			$gray-900,
-		'gray-800':			$gray-800,
-		'gray-700':			$gray-700,
-		'gray-400':			$gray-400,
-		'gray-600':			$gray-600,
-		'gray-500':			$gray-500,
-		'gray-300':			$gray-300,
-		'gray-200':			$gray-200,
-		'gray-100':			$gray-100,
-		'white':			$white,
-		'blue':				$blue,
-		'indigo':			$indigo,
-		'purple':			$purple,
-		'pink':				$pink,
-		'orange':			$orange,
-		'red':				$red,
-		'yellow':			$yellow,
-		'green':			$green,
-		'teal':				$teal,
-		'cyan':				$cyan,
-		'primary-d2':		$primary-d2,
-		'primary-d1':		$primary-d1,
-		'primary':			$primary,
-		'primary-l1':		$primary-l1,
-		'primary-l2':		$primary-l2,
-		'primary-l3':		$primary-l3,
-		'secondary-d2':		$secondary-d2,
-		'secondary-d1':		$secondary-d1,
-		'secondary':		$secondary,
-		'secondary-l1':		$secondary-l1,
-		'secondary-l2':		$secondary-l2,
-		'secondary-l3':		$secondary-l3,
-		'success-d2':		$success-d2,
-		'success-d1':		$success-d1,
-		'success':			$success,
-		'success-l1':		$success-l1,
-		'success-l2':		$success-l2,
-		'info-d2':			$info-d2,
-		'info-d1':			$info-d1,
-		'info':				$info,
-		'info-l1':			$info-l1,
-		'info-l2':			$info-l2,
-		'warning-d2':		$warning-d2,
-		'warning-d1':		$warning-d1,
-		'warning':			$warning,
-		'warning-l1':		$warning-l1,
-		'warning-l2':		$warning-l2,
-		'danger-d2':		$danger-d2,
-		'danger-d1':		$danger-d1,
-		'danger':			$danger,
-		'danger-l1':		$danger-l1,
-		'danger-l2':		$danger-l2,
-		'light-d2':			$light-d2,
-		'light-d1':			$light-d1,
-		'light':			$light,
-		'light-l1':			$light-l1,
-		'light-l2':			$light-l2,
-		'dark-d2':			$dark-d2,
-		'dark-d1':			$dark-d1,
-		'dark':				$dark,
-		'dark-l1':			$dark-l1,
-		'dark-l2':			$dark-l2,
+		'black': $black,
+		'gray-900': $gray-900,
+		'gray-800': $gray-800,
+		'gray-700': $gray-700,
+		'gray-400': $gray-400,
+		'gray-600': $gray-600,
+		'gray-500': $gray-500,
+		'gray-300': $gray-300,
+		'gray-200': $gray-200,
+		'gray-100': $gray-100,
+		'white': $white,
+		'blue': $blue,
+		'indigo': $indigo,
+		'purple': $purple,
+		'pink': $pink,
+		'orange': $orange,
+		'red': $red,
+		'yellow': $yellow,
+		'green': $green,
+		'teal': $teal,
+		'cyan': $cyan,
+		'primary-d2': $primary-d2,
+		'primary-d1': $primary-d1,
+		'primary': $primary,
+		'primary-l1': $primary-l1,
+		'primary-l2': $primary-l2,
+		'primary-l3': $primary-l3,
+		'secondary-d2': $secondary-d2,
+		'secondary-d1': $secondary-d1,
+		'secondary': $secondary,
+		'secondary-l1': $secondary-l1,
+		'secondary-l2': $secondary-l2,
+		'secondary-l3': $secondary-l3,
+		'success-d2': $success-d2,
+		'success-d1': $success-d1,
+		'success': $success,
+		'success-l1': $success-l1,
+		'success-l2': $success-l2,
+		'info-d2': $info-d2,
+		'info-d1': $info-d1,
+		'info': $info,
+		'info-l1': $info-l1,
+		'info-l2': $info-l2,
+		'warning-d2': $warning-d2,
+		'warning-d1': $warning-d1,
+		'warning': $warning,
+		'warning-l1': $warning-l1,
+		'warning-l2': $warning-l2,
+		'danger-d2': $danger-d2,
+		'danger-d1': $danger-d1,
+		'danger': $danger,
+		'danger-l1': $danger-l1,
+		'danger-l2': $danger-l2,
+		'light-d2': $light-d2,
+		'light-d1': $light-d1,
+		'light': $light,
+		'light-l1': $light-l1,
+		'light-l2': $light-l2,
+		'dark-d2': $dark-d2,
+		'dark-d1': $dark-d1,
+		'dark': $dark,
+		'dark-l1': $dark-l1,
+		'dark-l2': $dark-l2,
 	);
 
 	@each $swatch, $value in $swatches {
@@ -497,4 +501,4 @@
 			content: '#{$value}';
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/clayui.com/src/styles/site/_sidebar-site.scss b/clayui.com/src/styles/site/_sidebar-site.scss
index 7798c6c730..8122fe2ac7 100644
--- a/clayui.com/src/styles/site/_sidebar-site.scss
+++ b/clayui.com/src/styles/site/_sidebar-site.scss
@@ -18,7 +18,8 @@
 		}
 
 		@media (min-width: $grid-float-breakpoint) {
-			padding: $base-size * 1.33 $base-size $base-size * 2.4 $base-size * 0.33;
+			padding: $base-size * 1.33 $base-size $base-size * 2.4 $base-size *
+				0.33;
 		}
 
 		@media (max-width: $grid-float-breakpoint - 1) {
@@ -93,4 +94,4 @@
 			transform: rotate(90deg);
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/clayui.com/src/styles/site/_site.scss b/clayui.com/src/styles/site/_site.scss
index 511f9c3df7..4e126fff5f 100644
--- a/clayui.com/src/styles/site/_site.scss
+++ b/clayui.com/src/styles/site/_site.scss
@@ -37,4 +37,4 @@ body {
 	@media (min-width: $grid-float-breakpoint) {
 		flex-wrap: nowrap;
 	}
-}
\ No newline at end of file
+}
diff --git a/clayui.com/src/styles/site/_variables.scss b/clayui.com/src/styles/site/_variables.scss
index 38139067a2..e347374c51 100644
--- a/clayui.com/src/styles/site/_variables.scss
+++ b/clayui.com/src/styles/site/_variables.scss
@@ -1,4 +1,5 @@
-$font-family-system: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+$font-family-system: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+	Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
 
 // Site vars
 
@@ -6,25 +7,25 @@ $base-size: 24px; // 1.5rem aprox
 
 // Color
 
-$bg-color: #FFF;
+$bg-color: #fff;
 $docs-header-bg-color: #272833;
 $footer-bg-color: #272833;
 
 $brand-bg-dark: #272833;
 $brand-bg-dark-lighter: #393a4a;
-$brand-dark: #B3472D;
-$brand-dark-lighter: #F1F2F5;
+$brand-dark: #b3472d;
+$brand-dark-lighter: #f1f2f5;
 $brand-lighter: #ffd6cc;
 
-$brand-light: #F5F5F8;
+$brand-light: #f5f5f8;
 
-$brand-light-secondary-text: #A7A9BC;
+$brand-light-secondary-text: #a7a9bc;
 $brand-light-text: $brand-light;
 
-$brand-primary: #B16D50 !default;
-$brand-secondary: #30313F;
+$brand-primary: #b16d50 !default;
+$brand-secondary: #30313f;
 
-$brand-lighten: #FBF8F5;
+$brand-lighten: #fbf8f5;
 
 $text-color: #000 !default;
 
diff --git a/packages/clay-charts/src/scss/components/_arc.scss b/packages/clay-charts/src/scss/components/_arc.scss
index a0c2fda252..dc9877023f 100644
--- a/packages/clay-charts/src/scss/components/_arc.scss
+++ b/packages/clay-charts/src/scss/components/_arc.scss
@@ -1,29 +1,28 @@
 .bb-chart-arcs-title {
-  dominant-baseline: middle;
-  font-size: 1.3em;
+	dominant-baseline: middle;
+	font-size: 1.3em;
 }
 
-
 .bb-chart-arcs {
-  .bb-chart-arcs-background {
-    fill: #e0e0e0;
-    stroke: none;
-  }
+	.bb-chart-arcs-background {
+		fill: #e0e0e0;
+		stroke: none;
+	}
 
-  .bb-chart-arcs-gauge-unit {
-    fill: #000;
-    font-size: 16px;
-  }
+	.bb-chart-arcs-gauge-unit {
+		fill: #000;
+		font-size: 16px;
+	}
 
-  .bb-chart-arcs-gauge-max {
-    fill: #777;
-  }
+	.bb-chart-arcs-gauge-max {
+		fill: #777;
+	}
 
-  .bb-chart-arcs-gauge-min {
-    fill: #777;
-  }
+	.bb-chart-arcs-gauge-min {
+		fill: #777;
+	}
 }
 
 .bb-chart-arc .bb-gauge-value {
-  fill: #000;
+	fill: #000;
 }
diff --git a/packages/clay-charts/src/scss/components/_area.scss b/packages/clay-charts/src/scss/components/_area.scss
index d00f373221..9c19a0480c 100644
--- a/packages/clay-charts/src/scss/components/_area.scss
+++ b/packages/clay-charts/src/scss/components/_area.scss
@@ -1,4 +1,4 @@
 .bb-area {
-  stroke-width: 0;
-  opacity: 0.2;
+	stroke-width: 0;
+	opacity: 0.2;
 }
diff --git a/packages/clay-charts/src/scss/components/_axis.scss b/packages/clay-charts/src/scss/components/_axis.scss
index f0bdb98d67..1c3c83d992 100644
--- a/packages/clay-charts/src/scss/components/_axis.scss
+++ b/packages/clay-charts/src/scss/components/_axis.scss
@@ -1,8 +1,14 @@
-.bb-axis-x .tick {}
-.bb-axis-x-label {}
+.bb-axis-x .tick {
+}
+.bb-axis-x-label {
+}
 
-.bb-axis-y .tick {}
-.bb-axis-y-label {}
+.bb-axis-y .tick {
+}
+.bb-axis-y-label {
+}
 
-.bb-axis-y2 .tick {}
-.bb-axis-y2-label {}
+.bb-axis-y2 .tick {
+}
+.bb-axis-y2-label {
+}
diff --git a/packages/clay-charts/src/scss/components/_bar.scss b/packages/clay-charts/src/scss/components/_bar.scss
index 197972acc7..cf90fe9b26 100644
--- a/packages/clay-charts/src/scss/components/_bar.scss
+++ b/packages/clay-charts/src/scss/components/_bar.scss
@@ -1,7 +1,7 @@
 .bb-bar {
-  stroke-width: 0;
+	stroke-width: 0;
 
-  &._expanded_ {
-    fill-opacity: 0.75;
-  }
+	&._expanded_ {
+		fill-opacity: 0.75;
+	}
 }
diff --git a/packages/clay-charts/src/scss/components/_brush.scss b/packages/clay-charts/src/scss/components/_brush.scss
index 23fd16bfc8..c2591097ba 100644
--- a/packages/clay-charts/src/scss/components/_brush.scss
+++ b/packages/clay-charts/src/scss/components/_brush.scss
@@ -1,3 +1,3 @@
 .bb-brush .extent {
-  fill-opacity: .1;
+	fill-opacity: 0.1;
 }
diff --git a/packages/clay-charts/src/scss/components/_chart.scss b/packages/clay-charts/src/scss/components/_chart.scss
index b78e2e360d..38f0ab4304 100644
--- a/packages/clay-charts/src/scss/components/_chart.scss
+++ b/packages/clay-charts/src/scss/components/_chart.scss
@@ -1,24 +1,26 @@
 .bb {
-  svg {
-    font: 10px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-  }
+	svg {
+		font: 10px -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+			'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji',
+			'Segoe UI Emoji', 'Segoe UI Symbol';
+		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+	}
 
-  path, line {
-    fill: none;
-    stroke: #e5e5eb;
-  }
+	path,
+	line {
+		fill: none;
+		stroke: #e5e5eb;
+	}
 
-  text {
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    user-select: none;
-
-    tspan {
-      fill: #6b6c7e;
-    }
-  }
+	text {
+		-webkit-user-select: none;
+		-moz-user-select: none;
+		user-select: none;
 
+		tspan {
+			fill: #6b6c7e;
+		}
+	}
 }
 
 .bb-legend-item-tile,
@@ -26,16 +28,16 @@
 .bb-ygrid,
 .bb-event-rect,
 .bb-bars path {
-  shape-rendering: crispEdges;
+	shape-rendering: crispEdges;
 }
 
 .bb-chart-arc {
-  path {
-    stroke: #fff;
-  }
+	path {
+		stroke: #fff;
+	}
 
-  text {
-    fill: #fff;
-    font-size: 13px;
-  }
+	text {
+		fill: #fff;
+		font-size: 13px;
+	}
 }
diff --git a/packages/clay-charts/src/scss/components/_focus.scss b/packages/clay-charts/src/scss/components/_focus.scss
index 7b0c623cf3..8d81348b10 100644
--- a/packages/clay-charts/src/scss/components/_focus.scss
+++ b/packages/clay-charts/src/scss/components/_focus.scss
@@ -1,15 +1,16 @@
 .bb-target {
-  &.bb-focused {
-    opacity: 1;
-  }
+	&.bb-focused {
+		opacity: 1;
+	}
 
-  &.bb-focused {
-    path.bb-line, path.bb-step {
-      stroke-width: 2px;
-    }
-  }
+	&.bb-focused {
+		path.bb-line,
+		path.bb-step {
+			stroke-width: 2px;
+		}
+	}
 
-  &.bb-defocused {
-    opacity: 0.3 !important;
-  }
+	&.bb-defocused {
+		opacity: 0.3 !important;
+	}
 }
diff --git a/packages/clay-charts/src/scss/components/_grid.scss b/packages/clay-charts/src/scss/components/_grid.scss
index ba5b990b68..b0d5c96022 100644
--- a/packages/clay-charts/src/scss/components/_grid.scss
+++ b/packages/clay-charts/src/scss/components/_grid.scss
@@ -1,16 +1,17 @@
 .bb-grid {
-  line {
-    stroke: rgb(229, 229, 235);
-    stroke-width: 0.5px;
-  }
+	line {
+		stroke: rgb(229, 229, 235);
+		stroke-width: 0.5px;
+	}
 
-  text {
-    fill: #aaa;
-  }
+	text {
+		fill: #aaa;
+	}
 }
 
-.bb-xgrid, .bb-ygrid {
-
+.bb-xgrid,
+.bb-ygrid {
 }
 
-.bb-xgrid-focus {}
+.bb-xgrid-focus {
+}
diff --git a/packages/clay-charts/src/scss/components/_legend.scss b/packages/clay-charts/src/scss/components/_legend.scss
index d0ca2d2125..70a83ce039 100644
--- a/packages/clay-charts/src/scss/components/_legend.scss
+++ b/packages/clay-charts/src/scss/components/_legend.scss
@@ -1,14 +1,14 @@
 .bb-legend-item {
-  font-size: 12px;
+	font-size: 12px;
 }
 
 .bb-legend-item-hidden {
-  opacity: 0.15;
+	opacity: 0.15;
 }
 
 .bb-legend-background {
-  opacity: 0.75;
-  fill: white;
-  stroke: lightgray;
-  stroke-width: 1;
+	opacity: 0.75;
+	fill: white;
+	stroke: lightgray;
+	stroke-width: 1;
 }
diff --git a/packages/clay-charts/src/scss/components/_line.scss b/packages/clay-charts/src/scss/components/_line.scss
index 602c4e91cc..d671b58467 100644
--- a/packages/clay-charts/src/scss/components/_line.scss
+++ b/packages/clay-charts/src/scss/components/_line.scss
@@ -1,39 +1,39 @@
 .bb-line {
-  stroke-width: 2px;
+	stroke-width: 2px;
 }
 
 .bb-line-dashed-2-2 {
-  stroke-dasharray: 2 2;
+	stroke-dasharray: 2 2;
 }
 
 .bb-line-dashed-2-3 {
-  stroke-dasharray: 2 3;
+	stroke-dasharray: 2 3;
 }
 
 .bb-line-dashed-2-4 {
-  stroke-dasharray: 2 4;
+	stroke-dasharray: 2 4;
 }
 
 .bb-line-dashed-3-2 {
-  stroke-dasharray: 3 2;
+	stroke-dasharray: 3 2;
 }
 
 .bb-line-dashed-3-3 {
-  stroke-dasharray: 3 3;
+	stroke-dasharray: 3 3;
 }
 
 .bb-line-dashed-3-4 {
-  stroke-dasharray: 3 4;
+	stroke-dasharray: 3 4;
 }
 
 .bb-line-dashed-4-2 {
-  stroke-dasharray: 4 2;
+	stroke-dasharray: 4 2;
 }
 
 .bb-line-dashed-4-3 {
-  stroke-dasharray: 4 3;
+	stroke-dasharray: 4 3;
 }
 
 .bb-line-dashed-4-4 {
-  stroke-dasharray: 4 4;
+	stroke-dasharray: 4 4;
 }
diff --git a/packages/clay-charts/src/scss/components/_loading.scss b/packages/clay-charts/src/scss/components/_loading.scss
index 32d0d1cd5f..a61199beb6 100644
--- a/packages/clay-charts/src/scss/components/_loading.scss
+++ b/packages/clay-charts/src/scss/components/_loading.scss
@@ -1,8 +1,8 @@
 .loading-icon {
 	min-height: 320px;
 	min-height: 320px;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  vertical-align: middle;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	vertical-align: middle;
 }
diff --git a/packages/clay-charts/src/scss/components/_point.scss b/packages/clay-charts/src/scss/components/_point.scss
index 66f99a4585..b25927d639 100644
--- a/packages/clay-charts/src/scss/components/_point.scss
+++ b/packages/clay-charts/src/scss/components/_point.scss
@@ -1,9 +1,9 @@
 .bb-circle._expanded_ {
-  stroke-width: 1px;
-  stroke: white;
+	stroke-width: 1px;
+	stroke: white;
 }
 
 .bb-selected-circle {
-  fill: white;
-  stroke-width: 2px;
+	fill: white;
+	stroke-width: 2px;
 }
diff --git a/packages/clay-charts/src/scss/components/_radar.scss b/packages/clay-charts/src/scss/components/_radar.scss
index ec7015f41d..338117d759 100644
--- a/packages/clay-charts/src/scss/components/_radar.scss
+++ b/packages/clay-charts/src/scss/components/_radar.scss
@@ -1,33 +1,32 @@
 .bb-chart-radars {
-  .bb-levels {
-    polygon {
-      fill: none;
-      stroke: #848282;
-      stroke-width: .5px;
-    }
+	.bb-levels {
+		polygon {
+			fill: none;
+			stroke: #848282;
+			stroke-width: 0.5px;
+		}
 
-    text {
-      fill: #848282;
-    }
-  }
+		text {
+			fill: #848282;
+		}
+	}
 
-  .bb-axis {
-    line {
-      stroke: #848282;
-      stroke-width: .5px;
-    }
+	.bb-axis {
+		line {
+			stroke: #848282;
+			stroke-width: 0.5px;
+		}
 
-    text {
-      font-size: 1.15em;
-      cursor: default;
-    }
-  }
+		text {
+			font-size: 1.15em;
+			cursor: default;
+		}
+	}
 
-  .bb-shapes {
-    polygon {
-      fill-opacity: .2;
-      stroke-width: 1px;
-    }
-  }
+	.bb-shapes {
+		polygon {
+			fill-opacity: 0.2;
+			stroke-width: 1px;
+		}
+	}
 }
-
diff --git a/packages/clay-charts/src/scss/components/_region.scss b/packages/clay-charts/src/scss/components/_region.scss
index e3b46b73a2..e63ef51471 100644
--- a/packages/clay-charts/src/scss/components/_region.scss
+++ b/packages/clay-charts/src/scss/components/_region.scss
@@ -1,4 +1,4 @@
 .bb-region {
-  fill: steelblue;
-  fill-opacity: .1;
+	fill: steelblue;
+	fill-opacity: 0.1;
 }
diff --git a/packages/clay-charts/src/scss/components/_select_drag.scss b/packages/clay-charts/src/scss/components/_select_drag.scss
index f7a163d1d0..27fefa3215 100644
--- a/packages/clay-charts/src/scss/components/_select_drag.scss
+++ b/packages/clay-charts/src/scss/components/_select_drag.scss
@@ -1 +1,2 @@
-.bb-dragarea {}
+.bb-dragarea {
+}
diff --git a/packages/clay-charts/src/scss/components/_text.scss b/packages/clay-charts/src/scss/components/_text.scss
index 0ba5cd04d4..7e0642ec7f 100644
--- a/packages/clay-charts/src/scss/components/_text.scss
+++ b/packages/clay-charts/src/scss/components/_text.scss
@@ -1,6 +1,6 @@
 .bb-text {
-  &.bb-empty {
-    fill: #808080;
-    font-size: 2em;
-  }
-}
\ No newline at end of file
+	&.bb-empty {
+		fill: #808080;
+		font-size: 2em;
+	}
+}
diff --git a/packages/clay-charts/src/scss/components/_title.scss b/packages/clay-charts/src/scss/components/_title.scss
index 0fc6a40c22..7bebd60a87 100644
--- a/packages/clay-charts/src/scss/components/_title.scss
+++ b/packages/clay-charts/src/scss/components/_title.scss
@@ -1,3 +1,3 @@
 .bb-title {
-  font: 14px sans-serif;
+	font: 14px sans-serif;
 }
diff --git a/packages/clay-charts/src/scss/components/_tooltip.scss b/packages/clay-charts/src/scss/components/_tooltip.scss
index 9842b8da19..cfa71876df 100644
--- a/packages/clay-charts/src/scss/components/_tooltip.scss
+++ b/packages/clay-charts/src/scss/components/_tooltip.scss
@@ -1,63 +1,65 @@
 .bb-tooltip-container {
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: 1060;
-  display: block;
-  max-width: 276px;
-  padding: 12px;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  font-style: normal;
-  font-weight: normal;
-  line-height: 1.5;
-  text-align: start;
-  word-break: normal;
-  word-spacing: normal;
-  white-space: normal;
-  line-break: auto;
-  font-size: 0.875rem;
-  word-wrap: break-word;
-  background-color: #fff;
-  background-clip: padding-box;
-  border-radius: 0.3rem;
-  box-shadow: 0 1px 15px -2px rgba(0, 0, 0, 0.2);
+	position: absolute;
+	top: 0;
+	left: 0;
+	z-index: 1060;
+	display: block;
+	max-width: 276px;
+	padding: 12px;
+	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+		'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji',
+		'Segoe UI Emoji', 'Segoe UI Symbol';
+	font-style: normal;
+	font-weight: normal;
+	line-height: 1.5;
+	text-align: start;
+	word-break: normal;
+	word-spacing: normal;
+	white-space: normal;
+	line-break: auto;
+	font-size: 0.875rem;
+	word-wrap: break-word;
+	background-color: #fff;
+	background-clip: padding-box;
+	border-radius: 0.3rem;
+	box-shadow: 0 1px 15px -2px rgba(0, 0, 0, 0.2);
 }
 
 .bb-tooltip {
-  border-spacing: 0;
-  empty-cells: show;
+	border-spacing: 0;
+	empty-cells: show;
 
-  tr {
-  }
+	tr {
+	}
 
-  th {
-    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
-    font-size:14px;
-    padding:2px 5px;
-    text-align:left;
-    color: #000;
-  }
+	th {
+		border-bottom: 1px solid rgba(0, 0, 0, 0.2);
+		font-size: 14px;
+		padding: 2px 5px;
+		text-align: left;
+		color: #000;
+	}
 
-  td {
-    font-size:13px;
-    padding: 3px 6px;
-    background-color:#fff;
+	td {
+		font-size: 13px;
+		padding: 3px 6px;
+		background-color: #fff;
 
-    > span {
-      display: inline-block;
-      width: 10px;
-      height: 10px;
-      margin-right: 6px;
-    }
+		> span {
+			display: inline-block;
+			width: 10px;
+			height: 10px;
+			margin-right: 6px;
+		}
 
-    &.value {
-      text-align: right;
-    }
+		&.value {
+			text-align: right;
+		}
 
-    svg {
-      width: 10px;
-      height: 10px;
-      margin-right: 2px;
-    }
-  }
+		svg {
+			width: 10px;
+			height: 10px;
+			margin-right: 2px;
+		}
+	}
 }
diff --git a/packages/clay-charts/src/scss/main.scss b/packages/clay-charts/src/scss/main.scss
index 29b3ba969b..3559441b1b 100644
--- a/packages/clay-charts/src/scss/main.scss
+++ b/packages/clay-charts/src/scss/main.scss
@@ -1,18 +1,18 @@
-@import "components/arc";
-@import "components/area";
-@import "components/axis";
-@import "components/bar";
-@import "components/brush";
-@import "components/chart";
-@import "components/focus";
-@import "components/grid";
-@import "components/legend";
-@import "components/line";
-@import "components/loading";
-@import "components/point";
-@import "components/radar";
-@import "components/region";
-@import "components/select_drag";
-@import "components/text";
-@import "components/title";
-@import "components/tooltip";
\ No newline at end of file
+@import 'components/arc';
+@import 'components/area';
+@import 'components/axis';
+@import 'components/bar';
+@import 'components/brush';
+@import 'components/chart';
+@import 'components/focus';
+@import 'components/grid';
+@import 'components/legend';
+@import 'components/line';
+@import 'components/loading';
+@import 'components/point';
+@import 'components/radar';
+@import 'components/region';
+@import 'components/select_drag';
+@import 'components/text';
+@import 'components/title';
+@import 'components/tooltip';
diff --git a/packages/clay-css/src/scss/_components.scss b/packages/clay-css/src/scss/_components.scss
index 78a592b674..aa7a80a892 100644
--- a/packages/clay-css/src/scss/_components.scss
+++ b/packages/clay-css/src/scss/_components.scss
@@ -2,66 +2,66 @@
 	@import url($font-import-url);
 }
 
-@import "components/_grid";
+@import 'components/_grid';
 
-@import "components/_alerts";
-@import "components/_aspect-ratio";
-@import "components/_badges";
-@import "components/_breadcrumbs";
-@import "components/_button-groups";
-@import "components/_buttons";
-@import "components/_empty-state";
-@import "components/_labels";
-@import "components/_stickers";
+@import 'components/_alerts';
+@import 'components/_aspect-ratio';
+@import 'components/_badges';
+@import 'components/_breadcrumbs';
+@import 'components/_button-groups';
+@import 'components/_buttons';
+@import 'components/_empty-state';
+@import 'components/_labels';
+@import 'components/_stickers';
 
-@import "components/_cards";
-@import "components/_dropdowns";
+@import 'components/_cards';
+@import 'components/_dropdowns';
 
-@import "components/_drilldown";
-@import "components/_forms";
-@import "components/_links";
+@import 'components/_drilldown';
+@import 'components/_forms';
+@import 'components/_links';
 
-@import "components/_range";
-@import "components/_reorder";
+@import 'components/_range';
+@import 'components/_reorder';
 
-@import "components/_clay-color";
-@import "components/_custom-forms";
-@import "components/_time";
+@import 'components/_clay-color';
+@import 'components/_custom-forms';
+@import 'components/_time';
 
-@import "components/_date-picker";
-@import "components/_dual-listbox";
-@import "components/_form-validation";
-@import "components/_icons";
-@import "components/_input-groups";
-@import "components/_list-group";
-@import "components/_modals";
-@import "components/_multi-step-nav";
+@import 'components/_date-picker';
+@import 'components/_dual-listbox';
+@import 'components/_form-validation';
+@import 'components/_icons';
+@import 'components/_input-groups';
+@import 'components/_list-group';
+@import 'components/_modals';
+@import 'components/_multi-step-nav';
 
-@import "components/_navs";
+@import 'components/_navs';
 
-@import "components/_menubar";
-@import "components/_navbar";
+@import 'components/_menubar';
+@import 'components/_navbar';
 
-@import "components/_application-bar";
-@import "components/_management-bar";
-@import "components/_navigation-bar";
+@import 'components/_application-bar';
+@import 'components/_management-bar';
+@import 'components/_navigation-bar';
 
-@import "components/_pagination";
-@import "components/_panels";
-@import "components/_popovers";
-@import "components/_progress-bars";
-@import "components/_quick-action";
-@import "components/_sheets";
-@import "components/_side-navigation";
-@import "components/_sidebar";
-@import "components/_slideout";
-@import "components/_tables";
-@import "components/_tbar";
-@import "components/_timelines";
-@import "components/_toggle-switch";
-@import "components/_tooltip";
-@import "components/_type";
+@import 'components/_pagination';
+@import 'components/_panels';
+@import 'components/_popovers';
+@import 'components/_progress-bars';
+@import 'components/_quick-action';
+@import 'components/_sheets';
+@import 'components/_side-navigation';
+@import 'components/_sidebar';
+@import 'components/_slideout';
+@import 'components/_tables';
+@import 'components/_tbar';
+@import 'components/_timelines';
+@import 'components/_toggle-switch';
+@import 'components/_tooltip';
+@import 'components/_type';
 
-@import "components/_utilities";
+@import 'components/_utilities';
 
-@import "components/_loaders";
\ No newline at end of file
+@import 'components/_loaders';
diff --git a/packages/clay-css/src/scss/_mixins.scss b/packages/clay-css/src/scss/_mixins.scss
index 327d4ce63a..ae10d7a46b 100644
--- a/packages/clay-css/src/scss/_mixins.scss
+++ b/packages/clay-css/src/scss/_mixins.scss
@@ -1,39 +1,39 @@
-@import "mixins/_globals";
+@import 'mixins/_globals';
 
-@import "mixins/_vendor-prefixes";
+@import 'mixins/_vendor-prefixes';
 
-@import "mixins/_aspect-ratio";
-@import "mixins/_background";
-@import "mixins/_badges";
-@import "mixins/_box-shadow";
-@import "mixins/_buttons";
-@import "mixins/_cards";
-@import "mixins/_close";
-@import "mixins/_dropdown-menu";
-@import "mixins/_forms";
-@import "mixins/_grid";
-@import "mixins/_highlight";
-@import "mixins/_input-groups";
-@import "mixins/_labels";
-@import "mixins/_line-clamp";
-@import "mixins/_links";
-@import "mixins/_list-group";
-@import "mixins/_loaders";
-@import "mixins/_menubar";
-@import "mixins/_modals";
-@import "mixins/_monospace";
-@import "mixins/_nav";
-@import "mixins/_nav-nested";
-@import "mixins/_navbar";
-@import "mixins/_panels";
-@import "mixins/_position";
-@import "mixins/_scale-component";
-@import "mixins/_sheet";
-@import "mixins/_sidebar";
-@import "mixins/_slideout";
-@import "mixins/_stickers";
-@import "mixins/_tbar";
-@import "mixins/_timelines";
-@import "mixins/_toggle-switch";
-@import "mixins/_type";
-@import "mixins/_utilities";
\ No newline at end of file
+@import 'mixins/_aspect-ratio';
+@import 'mixins/_background';
+@import 'mixins/_badges';
+@import 'mixins/_box-shadow';
+@import 'mixins/_buttons';
+@import 'mixins/_cards';
+@import 'mixins/_close';
+@import 'mixins/_dropdown-menu';
+@import 'mixins/_forms';
+@import 'mixins/_grid';
+@import 'mixins/_highlight';
+@import 'mixins/_input-groups';
+@import 'mixins/_labels';
+@import 'mixins/_line-clamp';
+@import 'mixins/_links';
+@import 'mixins/_list-group';
+@import 'mixins/_loaders';
+@import 'mixins/_menubar';
+@import 'mixins/_modals';
+@import 'mixins/_monospace';
+@import 'mixins/_nav';
+@import 'mixins/_nav-nested';
+@import 'mixins/_navbar';
+@import 'mixins/_panels';
+@import 'mixins/_position';
+@import 'mixins/_scale-component';
+@import 'mixins/_sheet';
+@import 'mixins/_sidebar';
+@import 'mixins/_slideout';
+@import 'mixins/_stickers';
+@import 'mixins/_tbar';
+@import 'mixins/_timelines';
+@import 'mixins/_toggle-switch';
+@import 'mixins/_type';
+@import 'mixins/_utilities';
diff --git a/packages/clay-css/src/scss/_variables.scss b/packages/clay-css/src/scss/_variables.scss
index e8368715b7..af028418be 100644
--- a/packages/clay-css/src/scss/_variables.scss
+++ b/packages/clay-css/src/scss/_variables.scss
@@ -1,58 +1,58 @@
-@import "variables/_globals";
-@import "variables/_globals-z-index";
-
-@import "variables/_alerts";
-@import "variables/_badges";
-@import "variables/_breadcrumbs";
-@import "variables/_buttons";
-@import "variables/_empty-state";
-@import "variables/_labels";
-@import "variables/_stickers";
-
-@import "variables/_cards";
-@import "variables/_dropdowns";
-
-@import "variables/_drilldown";
-@import "variables/_forms";
-@import "variables/_links";
-
-@import "variables/_range";
-@import "variables/_reorder";
-
-@import "variables/_clay-color";
-@import "variables/_custom-forms";
-@import "variables/_time";
-
-@import "variables/_date-picker";
-@import "variables/_dual-listbox";
-@import "variables/_list-group";
-@import "variables/_loaders";
-@import "variables/_modals";
-@import "variables/_multi-step-nav";
-@import "variables/_navs";
-
-@import "variables/_icons";
-
-@import "variables/_menubar";
-@import "variables/_navbar";
-
-@import "variables/_application-bar";
-@import "variables/_management-bar";
-@import "variables/_navigation-bar";
-@import "variables/_pagination";
-@import "variables/_panels";
-@import "variables/_popovers";
-@import "variables/_progress-bars";
-@import "variables/_quick-action";
-@import "variables/_sheets";
-@import "variables/_side-navigation";
-@import "variables/_sidebar";
-@import "variables/_slideout";
-@import "variables/_tables";
-@import "variables/_tbar";
-@import "variables/_timelines";
-@import "variables/_toggle-switch";
-@import "variables/_tooltip";
-@import "variables/_type";
-
-@import "variables/_utilities";
\ No newline at end of file
+@import 'variables/_globals';
+@import 'variables/_globals-z-index';
+
+@import 'variables/_alerts';
+@import 'variables/_badges';
+@import 'variables/_breadcrumbs';
+@import 'variables/_buttons';
+@import 'variables/_empty-state';
+@import 'variables/_labels';
+@import 'variables/_stickers';
+
+@import 'variables/_cards';
+@import 'variables/_dropdowns';
+
+@import 'variables/_drilldown';
+@import 'variables/_forms';
+@import 'variables/_links';
+
+@import 'variables/_range';
+@import 'variables/_reorder';
+
+@import 'variables/_clay-color';
+@import 'variables/_custom-forms';
+@import 'variables/_time';
+
+@import 'variables/_date-picker';
+@import 'variables/_dual-listbox';
+@import 'variables/_list-group';
+@import 'variables/_loaders';
+@import 'variables/_modals';
+@import 'variables/_multi-step-nav';
+@import 'variables/_navs';
+
+@import 'variables/_icons';
+
+@import 'variables/_menubar';
+@import 'variables/_navbar';
+
+@import 'variables/_application-bar';
+@import 'variables/_management-bar';
+@import 'variables/_navigation-bar';
+@import 'variables/_pagination';
+@import 'variables/_panels';
+@import 'variables/_popovers';
+@import 'variables/_progress-bars';
+@import 'variables/_quick-action';
+@import 'variables/_sheets';
+@import 'variables/_side-navigation';
+@import 'variables/_sidebar';
+@import 'variables/_slideout';
+@import 'variables/_tables';
+@import 'variables/_tbar';
+@import 'variables/_timelines';
+@import 'variables/_toggle-switch';
+@import 'variables/_tooltip';
+@import 'variables/_type';
+
+@import 'variables/_utilities';
diff --git a/packages/clay-css/src/scss/atlas-variables.scss b/packages/clay-css/src/scss/atlas-variables.scss
index 6b87771791..98add04642 100644
--- a/packages/clay-css/src/scss/atlas-variables.scss
+++ b/packages/clay-css/src/scss/atlas-variables.scss
@@ -1,16 +1,16 @@
 // INSERT CUSTOM BASE VARS
 
-@import "functions/_global-functions";
+@import 'functions/_global-functions';
 
-@import "atlas/_variables";
+@import 'atlas/_variables';
 
-@import "variables/_bs4-variable-overwrites";
+@import 'variables/_bs4-variable-overwrites';
 
-@import "bootstrap/_functions";
-@import "bootstrap/_variables";
-@import "bootstrap/_mixins";
+@import 'bootstrap/_functions';
+@import 'bootstrap/_variables';
+@import 'bootstrap/_mixins';
 
-@import "_variables";
-@import "_mixins";
+@import '_variables';
+@import '_mixins';
 
-// INSERT CUSTOM VARS
\ No newline at end of file
+// INSERT CUSTOM VARS
diff --git a/packages/clay-css/src/scss/atlas.scss b/packages/clay-css/src/scss/atlas.scss
index 5c250a6271..c50e19daef 100644
--- a/packages/clay-css/src/scss/atlas.scss
+++ b/packages/clay-css/src/scss/atlas.scss
@@ -1,17 +1,17 @@
 // INSERT CUSTOM VARS
 
-@import "functions/_global-functions";
+@import 'functions/_global-functions';
 
-@import "atlas/_variables";
+@import 'atlas/_variables';
 
-@import "variables/_bs4-variable-overwrites";
+@import 'variables/_bs4-variable-overwrites';
 
-@import "bootstrap/bootstrap";
+@import 'bootstrap/bootstrap';
 
-@import "_variables";
+@import '_variables';
 
-@import "_mixins";
+@import '_mixins';
 
-@import "_components";
+@import '_components';
 
-// INSERT CUSTOM EXTENSIONS
\ No newline at end of file
+// INSERT CUSTOM EXTENSIONS
diff --git a/packages/clay-css/src/scss/atlas/_variables.scss b/packages/clay-css/src/scss/atlas/_variables.scss
index af45329b73..850c9a5e2b 100644
--- a/packages/clay-css/src/scss/atlas/_variables.scss
+++ b/packages/clay-css/src/scss/atlas/_variables.scss
@@ -1,52 +1,52 @@
-@import "variables/_globals";
-
-@import "variables/_alerts";
-@import "variables/_badges";
-@import "variables/_breadcrumbs";
-@import "variables/_buttons";
-@import "variables/_labels";
-@import "variables/_stickers";
-
-@import "variables/_cards";
-@import "variables/_dropdowns";
-
-@import "variables/_drilldown";
-@import "variables/_forms";
-@import "variables/_links";
-
-@import "variables/_range";
-@import "variables/_reorder";
-
-@import "variables/_clay-color";
-@import "variables/_custom-forms";
-@import "variables/_time";
-
-@import "variables/_date-picker";
-@import "variables/_icons";
-@import "variables/_list-group";
-@import "variables/_loaders";
-@import "variables/_modals";
-@import "variables/_multi-step-nav";
-@import "variables/_navs";
-
-@import "variables/_menubar";
-@import "variables/_navbar";
-
-@import "variables/_application-bar";
-@import "variables/_management-bar";
-@import "variables/_navigation-bar";
-@import "variables/_pagination";
-@import "variables/_panels";
-@import "variables/_popovers";
-@import "variables/_progress-bars";
-@import "variables/_quick-action";
-@import "variables/_sheets";
-@import "variables/_sidebar";
-@import "variables/_tables";
-@import "variables/_tbar";
-@import "variables/_timelines";
-@import "variables/_toggle-switch";
-@import "variables/_tooltip";
-@import "variables/_type";
-
-@import "variables/_utilities";
\ No newline at end of file
+@import 'variables/_globals';
+
+@import 'variables/_alerts';
+@import 'variables/_badges';
+@import 'variables/_breadcrumbs';
+@import 'variables/_buttons';
+@import 'variables/_labels';
+@import 'variables/_stickers';
+
+@import 'variables/_cards';
+@import 'variables/_dropdowns';
+
+@import 'variables/_drilldown';
+@import 'variables/_forms';
+@import 'variables/_links';
+
+@import 'variables/_range';
+@import 'variables/_reorder';
+
+@import 'variables/_clay-color';
+@import 'variables/_custom-forms';
+@import 'variables/_time';
+
+@import 'variables/_date-picker';
+@import 'variables/_icons';
+@import 'variables/_list-group';
+@import 'variables/_loaders';
+@import 'variables/_modals';
+@import 'variables/_multi-step-nav';
+@import 'variables/_navs';
+
+@import 'variables/_menubar';
+@import 'variables/_navbar';
+
+@import 'variables/_application-bar';
+@import 'variables/_management-bar';
+@import 'variables/_navigation-bar';
+@import 'variables/_pagination';
+@import 'variables/_panels';
+@import 'variables/_popovers';
+@import 'variables/_progress-bars';
+@import 'variables/_quick-action';
+@import 'variables/_sheets';
+@import 'variables/_sidebar';
+@import 'variables/_tables';
+@import 'variables/_tbar';
+@import 'variables/_timelines';
+@import 'variables/_toggle-switch';
+@import 'variables/_tooltip';
+@import 'variables/_type';
+
+@import 'variables/_utilities';
diff --git a/packages/clay-css/src/scss/atlas/variables/_alerts.scss b/packages/clay-css/src/scss/atlas/variables/_alerts.scss
index 508a6a709f..0da9fdd932 100644
--- a/packages/clay-css/src/scss/atlas/variables/_alerts.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_alerts.scss
@@ -24,17 +24,23 @@ $alert-link-font-weight: $font-weight-semi-bold !default;
 $alert-indicator-font-size: inherit !default;
 
 $alert-title: () !default;
-$alert-title: map-deep-merge((
-	font-size: 0.875rem,
-	margin-bottom: 0.25rem,
-	margin-top: 0
-), $alert-title);
+$alert-title: map-deep-merge(
+	(
+		font-size: 0.875rem,
+		margin-bottom: 0.25rem,
+		margin-top: 0,
+	),
+	$alert-title
+);
 
 $alert-subtitle: () !default;
-$alert-subtitle: map-deep-merge((
-	font-size: 0.75rem,
-	font-weight: $font-weight-normal
-), $alert-subtitle);
+$alert-subtitle: map-deep-merge(
+	(
+		font-size: 0.75rem,
+		font-weight: $font-weight-normal,
+	),
+	$alert-subtitle
+);
 
 // Alert Notification
 
@@ -43,12 +49,15 @@ $alert-notifications-box-shadow: 0 0.5rem 2rem -0.25rem rgba(0, 0, 0, 0.3) !defa
 // Alert Autofit Row
 
 $alert-autofit-row: () !default;
-$alert-autofit-row: map-deep-merge((
-	margin-left: -0.25rem,
-	margin-right: -0.25rem,
-	autofit-col-padding-left: 0.25rem,
-	autofit-col-padding-right: 0.25rem,
-), $alert-autofit-row);
+$alert-autofit-row: map-deep-merge(
+	(
+		margin-left: -0.25rem,
+		margin-right: -0.25rem,
+		autofit-col-padding-left: 0.25rem,
+		autofit-col-padding-right: 0.25rem,
+	),
+	$alert-autofit-row
+);
 
 // Alert Variants
 
@@ -60,10 +69,13 @@ $alert-primary-close-hover-color: $alert-primary-color !default;
 $alert-primary-lead-color: $alert-primary-color !default;
 $alert-primary-link-color: $link-color !default;
 $alert-primary-btn: () !default;
-$alert-primary-btn: map-deep-merge((
-	border-color: $primary-l1,
-	hover-border-color: $primary,
-), $alert-primary-btn);
+$alert-primary-btn: map-deep-merge(
+	(
+		border-color: $primary-l1,
+		hover-border-color: $primary,
+	),
+	$alert-primary-btn
+);
 
 $alert-secondary-color: $secondary !default;
 $alert-secondary-bg: $secondary-l3 !default;
@@ -73,10 +85,13 @@ $alert-secondary-close-hover-color: $alert-secondary-color !default;
 $alert-secondary-lead-color: $alert-secondary-color !default;
 $alert-secondary-link-color: $link-color !default;
 $alert-secondary-btn: () !default;
-$alert-secondary-btn: map-deep-merge((
-	border-color: $secondary-l1,
-	hover-border-color: $secondary,
-), $alert-secondary-btn);
+$alert-secondary-btn: map-deep-merge(
+	(
+		border-color: $secondary-l1,
+		hover-border-color: $secondary,
+	),
+	$alert-secondary-btn
+);
 
 $alert-success-color: $success !default;
 $alert-success-bg: $success-l2 !default;
@@ -86,10 +101,13 @@ $alert-success-close-hover-color: $alert-success-color !default;
 $alert-success-lead-color: $alert-success-color !default;
 $alert-success-link-color: $link-color !default;
 $alert-success-btn: () !default;
-$alert-success-btn: map-deep-merge((
-	border-color: $success-l1,
-	hover-border-color: $success,
-), $alert-success-btn);
+$alert-success-btn: map-deep-merge(
+	(
+		border-color: $success-l1,
+		hover-border-color: $success,
+	),
+	$alert-success-btn
+);
 
 $alert-info-color: $info !default;
 $alert-info-bg: $info-l2 !default;
@@ -99,10 +117,13 @@ $alert-info-close-hover-color: $alert-info-color !default;
 $alert-info-lead-color: $alert-info-color !default;
 $alert-info-link-color: $link-color !default;
 $alert-info-btn: () !default;
-$alert-info-btn: map-deep-merge((
-	border-color: $info-l1,
-	hover-border-color: $info,
-), $alert-info-btn);
+$alert-info-btn: map-deep-merge(
+	(
+		border-color: $info-l1,
+		hover-border-color: $info,
+	),
+	$alert-info-btn
+);
 
 $alert-warning-color: $warning !default;
 $alert-warning-bg: $warning-l2 !default;
@@ -112,10 +133,13 @@ $alert-warning-close-hover-color: $alert-warning-color !default;
 $alert-warning-lead-color: $alert-warning-color !default;
 $alert-warning-link-color: $link-color !default;
 $alert-warning-btn: () !default;
-$alert-warning-btn: map-deep-merge((
-	border-color: $warning-l1,
-	hover-border-color: $warning,
-), $alert-warning-btn);
+$alert-warning-btn: map-deep-merge(
+	(
+		border-color: $warning-l1,
+		hover-border-color: $warning,
+	),
+	$alert-warning-btn
+);
 
 $alert-danger-color: $danger !default;
 $alert-danger-bg: $danger-l2 !default;
@@ -125,10 +149,13 @@ $alert-danger-close-hover-color: $alert-danger-color !default;
 $alert-danger-lead-color: $alert-danger-color !default;
 $alert-danger-link-color: $link-color !default;
 $alert-danger-btn: () !default;
-$alert-danger-btn: map-deep-merge((
-	border-color: $danger-l1,
-	hover-border-color: $danger,
-), $alert-danger-btn);
+$alert-danger-btn: map-deep-merge(
+	(
+		border-color: $danger-l1,
+		hover-border-color: $danger,
+	),
+	$alert-danger-btn
+);
 
 $alert-light-color: $dark !default;
 $alert-light-bg: $light-l2 !default;
@@ -138,15 +165,18 @@ $alert-light-close-hover-color: $alert-light-color !default;
 $alert-light-lead-color: $alert-light-color !default;
 $alert-light-link-color: $link-color !default;
 $alert-light-btn: () !default;
-$alert-light-btn: map-deep-merge((
-	border-color: $dark-l1,
-	color: $dark,
-	hover-bg: $dark,
-	hover-border-color: $dark,
-	hover-color: $white,
-	active-bg: darken($dark, 5%),
-	active-border-color: darken($dark, 5%),
-), $alert-light-btn);
+$alert-light-btn: map-deep-merge(
+	(
+		border-color: $dark-l1,
+		color: $dark,
+		hover-bg: $dark,
+		hover-border-color: $dark,
+		hover-color: $white,
+		active-bg: darken($dark, 5%),
+		active-border-color: darken($dark, 5%),
+	),
+	$alert-light-btn
+);
 
 $alert-dark-color: $light !default;
 $alert-dark-bg: $dark-l2 !default;
@@ -156,7 +186,10 @@ $alert-dark-close-hover-color: $alert-dark-color !default;
 $alert-dark-lead-color: $alert-dark-color !default;
 $alert-dark-link-color: $alert-dark-color !default;
 $alert-dark-btn: () !default;
-$alert-dark-btn: map-deep-merge((
-	border-color: $dark-l1,
-	hover-border-color: $dark,
-), $alert-dark-btn);
\ No newline at end of file
+$alert-dark-btn: map-deep-merge(
+	(
+		border-color: $dark-l1,
+		hover-border-color: $dark,
+	),
+	$alert-dark-btn
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_application-bar.scss b/packages/clay-css/src/scss/atlas/variables/_application-bar.scss
index 85e1ba1e7d..22cd8a73df 100644
--- a/packages/clay-css/src/scss/atlas/variables/_application-bar.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_application-bar.scss
@@ -1,24 +1,33 @@
 $application-bar-size: () !default;
-$application-bar-size: map-deep-merge((
-	title-font-size: 1.125rem,
-), $application-bar-size);
+$application-bar-size: map-deep-merge(
+	(
+		title-font-size: 1.125rem,
+	),
+	$application-bar-size
+);
 
 $application-bar-base: () !default;
-$application-bar-base: map-deep-merge((
-	link-border-radius: $border-radius,
-	link-outline: 0,
-	link-transition: box-shadow 0.15s ease-in-out,
-	link-focus-box-shadow: $btn-focus-box-shadow,
-	link-disabled-box-shadow: none,
-), $application-bar-base);
+$application-bar-base: map-deep-merge(
+	(
+		link-border-radius: $border-radius,
+		link-outline: 0,
+		link-transition: box-shadow 0.15s ease-in-out,
+		link-focus-box-shadow: $btn-focus-box-shadow,
+		link-disabled-box-shadow: none,
+	),
+	$application-bar-base
+);
 
 $application-bar-dark: () !default;
-$application-bar-dark: map-deep-merge((
-	bg: $dark-l1,
-	link-font-weight: $font-weight-semi-bold,
-	link-hover-bg: rgba(255, 255, 255, 0.03),
-	link-focus-bg: rgba(255, 255, 255, 0.03),
-	link-active-bg: rgba(255, 255, 255, 0.06),
-	link-disabled-bg: transparent,
-	link-disabled-opacity: 0.5,
-), $application-bar-dark);
\ No newline at end of file
+$application-bar-dark: map-deep-merge(
+	(
+		bg: $dark-l1,
+		link-font-weight: $font-weight-semi-bold,
+		link-hover-bg: rgba(255, 255, 255, 0.03),
+		link-focus-bg: rgba(255, 255, 255, 0.03),
+		link-active-bg: rgba(255, 255, 255, 0.06),
+		link-disabled-bg: transparent,
+		link-disabled-opacity: 0.5,
+	),
+	$application-bar-dark
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_badges.scss b/packages/clay-css/src/scss/atlas/variables/_badges.scss
index e46f4b0b11..afeedbe939 100644
--- a/packages/clay-css/src/scss/atlas/variables/_badges.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_badges.scss
@@ -52,4 +52,4 @@ $badge-light-link-color: $badge-light-color !default;
 $badge-dark-color: $white !default;
 $badge-dark-bg: $dark !default;
 $badge-dark-hover-bg: $badge-dark-bg !default;
-$badge-dark-hover-color: $badge-dark-color !default;
\ No newline at end of file
+$badge-dark-hover-color: $badge-dark-color !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_breadcrumbs.scss b/packages/clay-css/src/scss/atlas/variables/_breadcrumbs.scss
index 74050de6c5..acc8759d33 100644
--- a/packages/clay-css/src/scss/atlas/variables/_breadcrumbs.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_breadcrumbs.scss
@@ -6,14 +6,17 @@ $breadcrumb-link-color: $gray-600 !default;
 $breadcrumb-link-hover-color: $breadcrumb-link-color !default;
 
 $breadcrumb-link: () !default;
-$breadcrumb-link: map-deep-merge((
-	border-radius: 1px,
-	transition: box-shadow 0.15s ease-in-out,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $breadcrumb-link);
+$breadcrumb-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		transition: box-shadow 0.15s ease-in-out,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$breadcrumb-link
+);
 
 $breadcrumb-active-color: $gray-900 !default;
 
 $breadcrumb-divider-color: $breadcrumb-link-color !default;
-$breadcrumb-divider-svg-icon-height: 0.6em !default;
\ No newline at end of file
+$breadcrumb-divider-svg-icon-height: 0.6em !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_buttons.scss b/packages/clay-css/src/scss/atlas/variables/_buttons.scss
index 9edbb483df..19964ced32 100644
--- a/packages/clay-css/src/scss/atlas/variables/_buttons.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_buttons.scss
@@ -3,7 +3,8 @@ $btn-box-shadow: 0 0 rgba(#000, 0) !default;
 $btn-font-weight: $font-weight-semi-bold !default;
 $btn-padding-x: 0.9375rem !default; // 15px
 $btn-padding-y: 0.4375rem !default; // 7px
-$btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
+$btn-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
+	border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !default;
 
 $btn-focus-box-shadow: $component-focus-box-shadow !default;
 
@@ -47,247 +48,296 @@ $btn-group-item-margin-right: 1rem !default;
 // Button Variants
 
 $btn-primary: () !default;
-$btn-primary: map-deep-merge((
-	hover-bg: $primary-d1,
-	hover-border-color: transparent,
-	focus-bg: $primary-d1,
-	focus-box-shadow: $btn-focus-box-shadow,
-	disabled-bg: $primary,
-	active-bg: $primary-d2,
-	active-border-color: transparent,
-	active-box-shadow: none,
-	active-focus-box-shadow: $btn-focus-box-shadow,
-), $btn-primary);
+$btn-primary: map-deep-merge(
+	(
+		hover-bg: $primary-d1,
+		hover-border-color: transparent,
+		focus-bg: $primary-d1,
+		focus-box-shadow: $btn-focus-box-shadow,
+		disabled-bg: $primary,
+		active-bg: $primary-d2,
+		active-border-color: transparent,
+		active-box-shadow: none,
+		active-focus-box-shadow: $btn-focus-box-shadow,
+	),
+	$btn-primary
+);
 
 $btn-secondary: () !default;
-$btn-secondary: map-deep-merge((
-	bg: $white,
-	border-color: $secondary-l2,
-	color: $secondary,
-	hover-bg: $gray-100,
-	hover-border-color: $secondary-l2,
-	hover-color: $gray-900,
-	focus-bg: $gray-100,
-	focus-border-color: $secondary-l2,
-	focus-box-shadow: $btn-focus-box-shadow,
-	focus-color: $gray-900,
-	disabled-bg: $white,
-	disabled-border-color: $secondary-l2,
-	disabled-color: $secondary,
-	active-border-color: $secondary-l2,
-	active-color: $gray-900,
-	active-bg: $gray-200,
-	active-box-shadow: none,
-	active-focus-box-shadow: $btn-focus-box-shadow,
-	loading-animation: null,
-), $btn-secondary);
+$btn-secondary: map-deep-merge(
+	(
+		bg: $white,
+		border-color: $secondary-l2,
+		color: $secondary,
+		hover-bg: $gray-100,
+		hover-border-color: $secondary-l2,
+		hover-color: $gray-900,
+		focus-bg: $gray-100,
+		focus-border-color: $secondary-l2,
+		focus-box-shadow: $btn-focus-box-shadow,
+		focus-color: $gray-900,
+		disabled-bg: $white,
+		disabled-border-color: $secondary-l2,
+		disabled-color: $secondary,
+		active-border-color: $secondary-l2,
+		active-color: $gray-900,
+		active-bg: $gray-200,
+		active-box-shadow: none,
+		active-focus-box-shadow: $btn-focus-box-shadow,
+		loading-animation: null,
+	),
+	$btn-secondary
+);
 
 $btn-success: () !default;
-$btn-success: map-deep-merge((
-	hover-bg: $success-d1,
-	hover-border-color: transparent,
-	focus-bg: $success-d1,
-	focus-border-color: transparent,
-	focus-box-shadow: $btn-focus-box-shadow,
-	disabled-bg: $success,
-	active-bg: $success-d2,
-	active-border-color: transparent,
-	active-box-shadow: none,
-	active-focus-box-shadow: $btn-focus-box-shadow,
-), $btn-success);
+$btn-success: map-deep-merge(
+	(
+		hover-bg: $success-d1,
+		hover-border-color: transparent,
+		focus-bg: $success-d1,
+		focus-border-color: transparent,
+		focus-box-shadow: $btn-focus-box-shadow,
+		disabled-bg: $success,
+		active-bg: $success-d2,
+		active-border-color: transparent,
+		active-box-shadow: none,
+		active-focus-box-shadow: $btn-focus-box-shadow,
+	),
+	$btn-success
+);
 
 $btn-info: () !default;
-$btn-info: map-deep-merge((
-	hover-bg: $info-d1,
-	hover-border-color: transparent,
-	focus-bg: $info-d1,
-	focus-border-color: transparent,
-	focus-box-shadow: $btn-focus-box-shadow,
-	disabled-bg: $info,
-	active-bg: $info-d2,
-	active-border-color: transparent,
-	active-box-shadow: none,
-	active-focus-box-shadow: $btn-focus-box-shadow,
-), $btn-info);
+$btn-info: map-deep-merge(
+	(
+		hover-bg: $info-d1,
+		hover-border-color: transparent,
+		focus-bg: $info-d1,
+		focus-border-color: transparent,
+		focus-box-shadow: $btn-focus-box-shadow,
+		disabled-bg: $info,
+		active-bg: $info-d2,
+		active-border-color: transparent,
+		active-box-shadow: none,
+		active-focus-box-shadow: $btn-focus-box-shadow,
+	),
+	$btn-info
+);
 
 $btn-warning: () !default;
-$btn-warning: map-deep-merge((
-	hover-bg: $warning-d1,
-	hover-border-color: transparent,
-	focus-bg: $warning-d1,
-	focus-border-color: transparent,
-	focus-box-shadow: $btn-focus-box-shadow,
-	disabled-bg: $warning,
-	active-bg: $warning-d2,
-	active-border-color: transparent,
-	active-box-shadow: none,
-	active-focus-box-shadow: $btn-focus-box-shadow,
-	loading-animation: 'loading-animation-light',
-), $btn-warning);
+$btn-warning: map-deep-merge(
+	(
+		hover-bg: $warning-d1,
+		hover-border-color: transparent,
+		focus-bg: $warning-d1,
+		focus-border-color: transparent,
+		focus-box-shadow: $btn-focus-box-shadow,
+		disabled-bg: $warning,
+		active-bg: $warning-d2,
+		active-border-color: transparent,
+		active-box-shadow: none,
+		active-focus-box-shadow: $btn-focus-box-shadow,
+		loading-animation: 'loading-animation-light',
+	),
+	$btn-warning
+);
 
 $btn-danger: () !default;
-$btn-danger: map-deep-merge((
-	hover-bg: $danger-d1,
-	hover-border-color: transparent,
-	focus-bg: $danger-d1,
-	focus-border-color: transparent,
-	focus-box-shadow: $btn-focus-box-shadow,
-	disabled-bg: $danger,
-	active-bg: $danger-d2,
-	active-border-color: transparent,
-	active-box-shadow: none,
-	active-focus-box-shadow: $btn-focus-box-shadow,
-), $btn-danger);
+$btn-danger: map-deep-merge(
+	(
+		hover-bg: $danger-d1,
+		hover-border-color: transparent,
+		focus-bg: $danger-d1,
+		focus-border-color: transparent,
+		focus-box-shadow: $btn-focus-box-shadow,
+		disabled-bg: $danger,
+		active-bg: $danger-d2,
+		active-border-color: transparent,
+		active-box-shadow: none,
+		active-focus-box-shadow: $btn-focus-box-shadow,
+	),
+	$btn-danger
+);
 
 $btn-light: () !default;
-$btn-light: map-deep-merge((
-	color: $gray-900,
-	hover-bg: $light-d1,
-	hover-border-color: transparent,
-	focus-bg: $light-d1,
-	focus-border-color: transparent,
-	focus-box-shadow: $btn-focus-box-shadow,
-	disabled-bg: $light,
-	active-bg: $light-d2,
-	active-border-color: transparent,
-	active-box-shadow: none,
-	active-focus-box-shadow: $btn-focus-box-shadow,
-), $btn-light);
+$btn-light: map-deep-merge(
+	(
+		color: $gray-900,
+		hover-bg: $light-d1,
+		hover-border-color: transparent,
+		focus-bg: $light-d1,
+		focus-border-color: transparent,
+		focus-box-shadow: $btn-focus-box-shadow,
+		disabled-bg: $light,
+		active-bg: $light-d2,
+		active-border-color: transparent,
+		active-box-shadow: none,
+		active-focus-box-shadow: $btn-focus-box-shadow,
+	),
+	$btn-light
+);
 
 $btn-dark: () !default;
-$btn-dark: map-deep-merge((
-	hover-bg: $dark-d1,
-	hover-border-color: transparent,
-	focus-bg: $dark-d1,
-	focus-border-color: transparent,
-	focus-box-shadow: $btn-focus-box-shadow,
-	disabled-bg: $dark,
-	active-bg: $dark-d2,
-	active-border-color: transparent,
-	active-box-shadow: none,
-	active-focus-box-shadow: $btn-focus-box-shadow,
-), $btn-dark);
+$btn-dark: map-deep-merge(
+	(
+		hover-bg: $dark-d1,
+		hover-border-color: transparent,
+		focus-bg: $dark-d1,
+		focus-border-color: transparent,
+		focus-box-shadow: $btn-focus-box-shadow,
+		disabled-bg: $dark,
+		active-bg: $dark-d2,
+		active-border-color: transparent,
+		active-box-shadow: none,
+		active-focus-box-shadow: $btn-focus-box-shadow,
+	),
+	$btn-dark
+);
 
 // Button Outline Variant
 
 $btn-outline-primary: () !default;
-$btn-outline-primary: map-deep-merge((
-	hover-bg: $primary-l3,
-	hover-color: $primary,
-	focus-bg: $primary-l3,
-	focus-box-shadow: map-get($btn-primary, focus-box-shadow),
-	focus-color: $primary,
-	disabled-bg: transparent,
-	disabled-border-color: map-get($btn-primary, bg),
-	disabled-color: map-get($btn-primary, bg),
-	active-bg: lighten(desaturate($primary, 42.05), 41.76),
-	active-color: $primary,
-	active-box-shadow: map-get($btn-primary, active-box-shadow),
-	active-focus-box-shadow: map-get($btn-primary, active-focus-box-shadow),
-), $btn-outline-primary);
+$btn-outline-primary: map-deep-merge(
+	(
+		hover-bg: $primary-l3,
+		hover-color: $primary,
+		focus-bg: $primary-l3,
+		focus-box-shadow: map-get($btn-primary, focus-box-shadow),
+		focus-color: $primary,
+		disabled-bg: transparent,
+		disabled-border-color: map-get($btn-primary, bg),
+		disabled-color: map-get($btn-primary, bg),
+		active-bg: lighten(desaturate($primary, 42.05), 41.76),
+		active-color: $primary,
+		active-box-shadow: map-get($btn-primary, active-box-shadow),
+		active-focus-box-shadow: map-get($btn-primary, active-focus-box-shadow),
+	),
+	$btn-outline-primary
+);
 
 $btn-outline-secondary: () !default;
-$btn-outline-secondary: map-deep-merge((
-	bg: null,
-	border-color: $secondary-l2,
-	color: null,
-	hover-bg: rgba($gray-900, 0.03),
-	hover-border-color: transparent,
-	hover-color: map-get($btn-secondary, hover-color),
-	focus-bg: rgba($gray-900, 0.03),
-	focus-border-color: transparent,
-	focus-box-shadow: map-get($btn-secondary, focus-box-shadow),
-	focus-color: map-get($btn-secondary, focus-color),
-	disabled-bg: transparent,
-	disabled-border-color: $secondary,
-	disabled-color: $secondary,
-	active-bg: rgba($gray-900, 0.06),
-	active-border-color: transparent,
-	active-box-shadow: map-get($btn-secondary, active-box-shadow),
-	active-color: map-get($btn-secondary, active-color),
-	active-focus-box-shadow: map-get($btn-secondary, active-focus-box-shadow),
-), $btn-outline-secondary);
+$btn-outline-secondary: map-deep-merge(
+	(
+		bg: null,
+		border-color: $secondary-l2,
+		color: null,
+		hover-bg: rgba($gray-900, 0.03),
+		hover-border-color: transparent,
+		hover-color: map-get($btn-secondary, hover-color),
+		focus-bg: rgba($gray-900, 0.03),
+		focus-border-color: transparent,
+		focus-box-shadow: map-get($btn-secondary, focus-box-shadow),
+		focus-color: map-get($btn-secondary, focus-color),
+		disabled-bg: transparent,
+		disabled-border-color: $secondary,
+		disabled-color: $secondary,
+		active-bg: rgba($gray-900, 0.06),
+		active-border-color: transparent,
+		active-box-shadow: map-get($btn-secondary, active-box-shadow),
+		active-color: map-get($btn-secondary, active-color),
+		active-focus-box-shadow:
+			map-get($btn-secondary, active-focus-box-shadow),
+	),
+	$btn-outline-secondary
+);
 
 $btn-outline-info: () !default;
-$btn-outline-info: map-deep-merge((
-	hover-bg: map-get($btn-info, hover-bg),
-	focus-bg: map-get($btn-info, hover-bg),
-	focus-box-shadow: map-get($btn-info, focus-box-shadow),
-	focus-color: $white,
-	disabled-bg: transparent,
-	disabled-border-color: map-get($btn-info, bg),
-	disabled-color: map-get($btn-info, bg),
-	active-bg: map-get($btn-info, active-bg),
-	active-box-shadow: map-get($btn-info, active-box-shadow),
-	active-focus-box-shadow: map-get($btn-info, active-focus-box-shadow),
-), $btn-outline-info);
+$btn-outline-info: map-deep-merge(
+	(
+		hover-bg: map-get($btn-info, hover-bg),
+		focus-bg: map-get($btn-info, hover-bg),
+		focus-box-shadow: map-get($btn-info, focus-box-shadow),
+		focus-color: $white,
+		disabled-bg: transparent,
+		disabled-border-color: map-get($btn-info, bg),
+		disabled-color: map-get($btn-info, bg),
+		active-bg: map-get($btn-info, active-bg),
+		active-box-shadow: map-get($btn-info, active-box-shadow),
+		active-focus-box-shadow: map-get($btn-info, active-focus-box-shadow),
+	),
+	$btn-outline-info
+);
 
 $btn-outline-success: () !default;
-$btn-outline-success: map-deep-merge((
-	hover-bg: map-get($btn-success, hover-bg),
-	focus-bg: map-get($btn-success, hover-bg),
-	focus-box-shadow: map-get($btn-success, focus-box-shadow),
-	focus-color: $white,
-	disabled-bg: transparent,
-	disabled-border-color: map-get($btn-success, bg),
-	disabled-color: map-get($btn-success, bg),
-	active-bg: map-get($btn-success, active-bg),
-	active-box-shadow: map-get($btn-success, active-box-shadow),
-	active-focus-box-shadow: map-get($btn-success, active-focus-box-shadow),
-), $btn-outline-success);
+$btn-outline-success: map-deep-merge(
+	(
+		hover-bg: map-get($btn-success, hover-bg),
+		focus-bg: map-get($btn-success, hover-bg),
+		focus-box-shadow: map-get($btn-success, focus-box-shadow),
+		focus-color: $white,
+		disabled-bg: transparent,
+		disabled-border-color: map-get($btn-success, bg),
+		disabled-color: map-get($btn-success, bg),
+		active-bg: map-get($btn-success, active-bg),
+		active-box-shadow: map-get($btn-success, active-box-shadow),
+		active-focus-box-shadow: map-get($btn-success, active-focus-box-shadow),
+	),
+	$btn-outline-success
+);
 
 $btn-outline-warning: () !default;
-$btn-outline-warning: map-deep-merge((
-	hover-bg: map-get($btn-warning, hover-bg),
-	focus-bg: map-get($btn-warning, hover-bg),
-	focus-box-shadow: map-get($btn-warning, focus-box-shadow),
-	focus-color: $white,
-	disabled-bg: transparent,
-	disabled-border-color: map-get($btn-warning, bg),
-	disabled-color: map-get($btn-warning, bg),
-	active-bg: map-get($btn-warning, active-bg),
-	active-box-shadow: map-get($btn-warning, active-box-shadow),
-	active-focus-box-shadow: map-get($btn-warning, active-focus-box-shadow),
-), $btn-outline-warning);
+$btn-outline-warning: map-deep-merge(
+	(
+		hover-bg: map-get($btn-warning, hover-bg),
+		focus-bg: map-get($btn-warning, hover-bg),
+		focus-box-shadow: map-get($btn-warning, focus-box-shadow),
+		focus-color: $white,
+		disabled-bg: transparent,
+		disabled-border-color: map-get($btn-warning, bg),
+		disabled-color: map-get($btn-warning, bg),
+		active-bg: map-get($btn-warning, active-bg),
+		active-box-shadow: map-get($btn-warning, active-box-shadow),
+		active-focus-box-shadow: map-get($btn-warning, active-focus-box-shadow),
+	),
+	$btn-outline-warning
+);
 
 $btn-outline-danger: () !default;
-$btn-outline-danger: map-deep-merge((
-	hover-bg: map-get($btn-danger, hover-bg),
-	focus-bg: map-get($btn-danger, hover-bg),
-	focus-box-shadow: map-get($btn-danger, focus-box-shadow),
-	focus-color: $white,
-	disabled-bg: transparent,
-	disabled-border-color: map-get($btn-danger, bg),
-	disabled-color: map-get($btn-danger, bg),
-	active-bg: map-get($btn-danger, active-bg),
-	active-box-shadow: map-get($btn-danger, active-box-shadow),
-	active-focus-box-shadow: map-get($btn-danger, active-focus-box-shadow),
-), $btn-outline-danger);
+$btn-outline-danger: map-deep-merge(
+	(
+		hover-bg: map-get($btn-danger, hover-bg),
+		focus-bg: map-get($btn-danger, hover-bg),
+		focus-box-shadow: map-get($btn-danger, focus-box-shadow),
+		focus-color: $white,
+		disabled-bg: transparent,
+		disabled-border-color: map-get($btn-danger, bg),
+		disabled-color: map-get($btn-danger, bg),
+		active-bg: map-get($btn-danger, active-bg),
+		active-box-shadow: map-get($btn-danger, active-box-shadow),
+		active-focus-box-shadow: map-get($btn-danger, active-focus-box-shadow),
+	),
+	$btn-outline-danger
+);
 
 $btn-outline-light: () !default;
-$btn-outline-light: map-deep-merge((
-	hover-bg: map-get($btn-light, hover-bg),
-	focus-bg: map-get($btn-light, hover-bg),
-	focus-box-shadow: map-get($btn-light, focus-box-shadow),
-	focus-color: $gray-900,
-	disabled-bg: transparent,
-	disabled-border-color: map-get($btn-light, bg),
-	disabled-color: map-get($btn-light, bg),
-	active-bg: map-get($btn-light, active-bg),
-	active-box-shadow: map-get($btn-light, active-box-shadow),
-	active-focus-box-shadow: map-get($btn-light, active-focus-box-shadow),
-), $btn-outline-light);
+$btn-outline-light: map-deep-merge(
+	(
+		hover-bg: map-get($btn-light, hover-bg),
+		focus-bg: map-get($btn-light, hover-bg),
+		focus-box-shadow: map-get($btn-light, focus-box-shadow),
+		focus-color: $gray-900,
+		disabled-bg: transparent,
+		disabled-border-color: map-get($btn-light, bg),
+		disabled-color: map-get($btn-light, bg),
+		active-bg: map-get($btn-light, active-bg),
+		active-box-shadow: map-get($btn-light, active-box-shadow),
+		active-focus-box-shadow: map-get($btn-light, active-focus-box-shadow),
+	),
+	$btn-outline-light
+);
 
 $btn-outline-dark: () !default;
-$btn-outline-dark: map-deep-merge((
-	hover-bg: map-get($btn-dark, hover-bg),
-	focus-bg: map-get($btn-dark, hover-bg),
-	focus-box-shadow: map-get($btn-dark, focus-box-shadow),
-	focus-color: $white,
-	disabled-bg: transparent,
-	disabled-border-color: map-get($btn-dark, bg),
-	disabled-color: map-get($btn-dark, bg),
-	active-bg: map-get($btn-dark, active-bg),
-	active-box-shadow: map-get($btn-dark, active-box-shadow),
-	active-focus-box-shadow: map-get($btn-dark, active-focus-box-shadow),
-), $btn-outline-dark);
\ No newline at end of file
+$btn-outline-dark: map-deep-merge(
+	(
+		hover-bg: map-get($btn-dark, hover-bg),
+		focus-bg: map-get($btn-dark, hover-bg),
+		focus-box-shadow: map-get($btn-dark, focus-box-shadow),
+		focus-color: $white,
+		disabled-bg: transparent,
+		disabled-border-color: map-get($btn-dark, bg),
+		disabled-color: map-get($btn-dark, bg),
+		active-bg: map-get($btn-dark, active-bg),
+		active-box-shadow: map-get($btn-dark, active-box-shadow),
+		active-focus-box-shadow: map-get($btn-dark, active-focus-box-shadow),
+	),
+	$btn-outline-dark
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_cards.scss b/packages/clay-css/src/scss/atlas/variables/_cards.scss
index f595ed4efb..408c2cee00 100644
--- a/packages/clay-css/src/scss/atlas/variables/_cards.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_cards.scss
@@ -7,106 +7,153 @@ $card-body-padding-left: 1rem !default;
 $card-body-padding-right: 1rem !default;
 $card-body-padding-top: 1rem !default;
 
-$card-inner-border-radius: if($card-border-width > 0, calc(#{$card-border-radius} - #{$card-border-width}), $card-border-radius) !default;
+$card-inner-border-radius: if(
+	$card-border-width > 0,
+	calc(#{$card-border-radius} - #{$card-border-width}),
+	$card-border-radius
+) !default;
 
 // Card Title
 
 $card-title: () !default;
-$card-title: map-deep-merge((
-	color: $gray-900,
-	font-size: 0.875rem,
-), $card-title);
+$card-title: map-deep-merge(
+	(
+		color: $gray-900,
+		font-size: 0.875rem,
+	),
+	$card-title
+);
 
 $card-title-link: () !default;
-$card-title-link: map-deep-merge((
-	hover-color: map-get($card-title, color)
-), $card-title-link);
+$card-title-link: map-deep-merge(
+	(
+		hover-color: map-get($card-title, color),
+	),
+	$card-title-link
+);
 
 // Card Subtitle
 
 $card-subtitle: () !default;
-$card-subtitle: map-deep-merge((
-	font-weight: $font-weight-normal
-), $card-subtitle);
+$card-subtitle: map-deep-merge(
+	(
+		font-weight: $font-weight-normal,
+	),
+	$card-subtitle
+);
 
 $card-subtitle-link: () !default;
-$card-subtitle-link: map-deep-merge((
-	hover-color: $gray-600,
-), $card-subtitle-link);
+$card-subtitle-link: map-deep-merge(
+	(
+		hover-color: $gray-600,
+	),
+	$card-subtitle-link
+);
 
 // Card Link
 
 $card-link: () !default;
-$card-link: map-deep-merge((
-	color: $gray-600,
-	font-size: 0.875rem,
-	hover-color: $gray-600,
-	hover-text-decoration: underline
-), $card-link);
+$card-link: map-deep-merge(
+	(
+		color: $gray-600,
+		font-size: 0.875rem,
+		hover-color: $gray-600,
+		hover-text-decoration: underline,
+	),
+	$card-link
+);
 
 $checkbox-left-card-padding: 50px !default;
 
-$form-check-card-checked-box-shadow: 0 0 0 2px lighten($component-active-bg, 22.94) !default;
+$form-check-card-checked-box-shadow: 0 0 0 2px
+	lighten($component-active-bg, 22.94) !default;
 
 // Card Interactive
 
 $card-interactive: () !default;
-$card-interactive: map-deep-merge((
-	hover-bg: #F7F8F9,
-	focus-border-color: null,
-	focus-box-shadow: 0 0 0 2px #FFF#{','} 0 0 0 4px #719AFF,
-	active-bg: #F1F2F5,
-), $card-interactive);
+$card-interactive: map-deep-merge(
+	(
+		hover-bg: #f7f8f9,
+		focus-border-color: null,
+		focus-box-shadow: 0 0 0 2px #FFF#{','} 0 0 0 4px #719aff,
+		active-bg: #f1f2f5,
+	),
+	$card-interactive
+);
 
 // Card Interactive Secondary
 
 $card-interactive-secondary: () !default;
-$card-interactive-secondary: map-deep-merge((
-	hover-border-color: transparent,
-	hover-box-shadow: 0 0 0 2px #719AFF,
-	focus-border-color: transparent,
-	focus-box-shadow: 0 0 0 2px #719AFF,
-), $card-interactive-secondary);
+$card-interactive-secondary: map-deep-merge(
+	(
+		hover-border-color: transparent,
+		hover-box-shadow: 0 0 0 2px #719aff,
+		focus-border-color: transparent,
+		focus-box-shadow: 0 0 0 2px #719aff,
+	),
+	$card-interactive-secondary
+);
 
 // Card Type Asset
 
 $card-type-asset: () !default;
-$card-type-asset: map-deep-merge((
-	aspect-ratio-border-color: $gray-300,
-	card-body-padding-top: 0.75rem
-), $card-type-asset);
+$card-type-asset: map-deep-merge(
+	(
+		aspect-ratio-border-color: $gray-300,
+		card-body-padding-top: 0.75rem,
+	),
+	$card-type-asset
+);
 
 $image-card: () !default;
-$image-card: map-deep-merge((
-	aspect-ratio-checkered-fg: $gray-300,
-), $image-card);
+$image-card: map-deep-merge(
+	(
+		aspect-ratio-checkered-fg: $gray-300,
+	),
+	$image-card
+);
 
 $file-card: () !default;
-$file-card: map-deep-merge((
-	asset-icon-color: $gray-400,
-), $file-card);
+$file-card: map-deep-merge(
+	(
+		asset-icon-color: $gray-400,
+	),
+	$file-card
+);
 
 // Card Type Template
 
 $card-type-template-after-highlight: () !default;
-$card-type-template-after-highlight: map-deep-merge((
-	bottom: -1px,
-	left: -1px,
-	right: -1px,
-), $card-type-template-after-highlight);
+$card-type-template-after-highlight: map-deep-merge(
+	(
+		bottom: -1px,
+		left: -1px,
+		right: -1px,
+	),
+	$card-type-template-after-highlight
+);
 
 $card-type-template-aspect-ratio: () !default;
-$card-type-template-aspect-ratio: map-deep-merge((
-	bg-image: none,
-), $card-type-template-aspect-ratio);
+$card-type-template-aspect-ratio: map-deep-merge(
+	(
+		bg-image: none,
+	),
+	$card-type-template-aspect-ratio
+);
 
 $card-type-template-aspect-ratio-item: () !default;
-$card-type-template-aspect-ratio-item: map-deep-merge((
-	color: $gray-600,
-), $card-type-template-aspect-ratio-item);
+$card-type-template-aspect-ratio-item: map-deep-merge(
+	(
+		color: $gray-600,
+	),
+	$card-type-template-aspect-ratio-item
+);
 
 $card-type-template: () !default;
-$card-type-template: map-deep-merge((
-	border-width: 1px,
-	box-shadow: none,
-), $card-type-template);
\ No newline at end of file
+$card-type-template: map-deep-merge(
+	(
+		border-width: 1px,
+		box-shadow: none,
+	),
+	$card-type-template
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_clay-color.scss b/packages/clay-css/src/scss/atlas/variables/_clay-color.scss
index 6fafc92eb8..5ec5806ea5 100644
--- a/packages/clay-css/src/scss/atlas/variables/_clay-color.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_clay-color.scss
@@ -1,29 +1,38 @@
 // Clay Color Dropdown Menu Close
 
 $clay-color-dropdown-menu-close: () !default;
-$clay-color-dropdown-menu-close: map-deep-merge((
-	color: $gray-600,
-	font-size: 0.875rem,
-	opacity: 1,
-	hover-bg: rgba($gray-900, 0.03),
-	focus-bg: rgba($gray-900, 0.03),
-	active-bg: rgba($gray-900, 0.06),
-	disabled-bg: transparent,
-), $clay-color-dropdown-menu-close);
+$clay-color-dropdown-menu-close: map-deep-merge(
+	(
+		color: $gray-600,
+		font-size: 0.875rem,
+		opacity: 1,
+		hover-bg: rgba($gray-900, 0.03),
+		focus-bg: rgba($gray-900, 0.03),
+		active-bg: rgba($gray-900, 0.06),
+		disabled-bg: transparent,
+	),
+	$clay-color-dropdown-menu-close
+);
 
 // Clay Color Dropdown Menu Component Action
 
 $clay-color-dropdown-menu-component-action: () !default;
-$clay-color-dropdown-menu-component-action: map-deep-merge((
-	hover-bg: null,
-	hover-color: null,
-	focus-box-shadow: null,
-	focus-color: null,
-), $clay-color-dropdown-menu-component-action);
+$clay-color-dropdown-menu-component-action: map-deep-merge(
+	(
+		hover-bg: null,
+		hover-color: null,
+		focus-box-shadow: null,
+		focus-color: null,
+	),
+	$clay-color-dropdown-menu-component-action
+);
 
 // Clay Color Pointer
 
 $clay-color-pointer: () !default;
-$clay-color-pointer: map-deep-merge((
-	focus-box-shadow: 0 0 0 0.125rem $primary-l1,
-), $clay-color-pointer);
\ No newline at end of file
+$clay-color-pointer: map-deep-merge(
+	(
+		focus-box-shadow: 0 0 0 0.125rem $primary-l1,
+	),
+	$clay-color-pointer
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_custom-forms.scss b/packages/clay-css/src/scss/atlas/variables/_custom-forms.scss
index 8c0a50f955..327c5dca0c 100644
--- a/packages/clay-css/src/scss/atlas/variables/_custom-forms.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_custom-forms.scss
@@ -35,7 +35,10 @@ $custom-control-indicator-checked-border-color: $custom-control-indicator-checke
 
 // @deprecated as of v2.2.1 use `$custom-control-indicator-checked-disabled-bg` instead
 
-$custom-control-indicator-disabled-checked-bg: lighten($component-active-bg, 32.94) !default;
+$custom-control-indicator-disabled-checked-bg: lighten(
+	$component-active-bg,
+	32.94
+) !default;
 $custom-control-indicator-checked-disabled-bg: $custom-control-indicator-disabled-checked-bg !default;
 
 // @deprecated as of v2.2.1 use `$custom-control-indicator-checked-disabled-border-color` instead
@@ -54,9 +57,12 @@ $custom-control-indicator-indeterminate-border-color: $custom-control-indicator-
 $custom-control-margin-bottom: 1rem !default;
 
 $custom-control: () !default;
-$custom-control: map-deep-merge((
-	line-height: 1,
-), $custom-control);
+$custom-control: map-deep-merge(
+	(
+		line-height: 1,
+	),
+	$custom-control
+);
 
 // Custom Control Description
 
@@ -78,15 +84,21 @@ $custom-control-label-disabled-color: $custom-control-description-disabled-color
 $custom-control-description-small-font-size: 100% !default;
 
 $custom-control-label: () !default;
-$custom-control-label: map-deep-merge((
-	font-size: $custom-control-description-font-size,
-	font-weight: $custom-control-description-font-weight,
-), $custom-control-label);
+$custom-control-label: map-deep-merge(
+	(
+		font-size: $custom-control-description-font-size,
+		font-weight: $custom-control-description-font-weight,
+	),
+	$custom-control-label
+);
 
 $custom-control-label-text-small: () !default;
-$custom-control-label-text-small: map-deep-merge((
-	font-size: $custom-control-description-small-font-size,
-), $custom-control-label-text-small);
+$custom-control-label-text-small: map-deep-merge(
+	(
+		font-size: $custom-control-description-small-font-size,
+	),
+	$custom-control-label-text-small
+);
 
 // Custom Checkbox
 
@@ -106,4 +118,4 @@ $custom-radio-indicator-disabled-border-color: $custom-control-indicator-disable
 // @deprecated as of v2.2.1 use `$custom-radio-indicator-checked-disabled-border-color` instead
 
 $custom-radio-indicator-disabled-checked-border-color: $custom-control-indicator-disabled-checked-border-color !default;
-$custom-radio-indicator-checked-disabled-border-color: $custom-radio-indicator-disabled-checked-border-color !default;
\ No newline at end of file
+$custom-radio-indicator-checked-disabled-border-color: $custom-radio-indicator-disabled-checked-border-color !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_date-picker.scss b/packages/clay-css/src/scss/atlas/variables/_date-picker.scss
index 76c44a68c3..9c35a2f8db 100644
--- a/packages/clay-css/src/scss/atlas/variables/_date-picker.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_date-picker.scss
@@ -1,57 +1,72 @@
 // Date Picker Nav
 
 $date-picker-nav-btn: () !default;
-$date-picker-nav-btn: map-deep-merge((
-	hover-color: $gray-900,
-	focus-bg: $gray-200,
-	focus-color: $gray-900,
-	active-bg: $gray-200,
-	disabled-color: $gray-500,
-	disabled-opacity: null,
-), $date-picker-nav-btn);
+$date-picker-nav-btn: map-deep-merge(
+	(
+		hover-color: $gray-900,
+		focus-bg: $gray-200,
+		focus-color: $gray-900,
+		active-bg: $gray-200,
+		disabled-color: $gray-500,
+		disabled-opacity: null,
+	),
+	$date-picker-nav-btn
+);
 
 $date-picker-nav-select: () !default;
-$date-picker-nav-select: map-deep-merge((
-	bg: transparent,
-	border-color: transparent,
-	color: $secondary,
-	font-size: $font-size-sm,
-	font-weight: $font-weight-semi-bold,
-	height: $input-height-sm,
-	padding-bottom: 0,
-	padding-left: 0.5rem,
-	padding-top: 0,
-	hover-bg: $gray-200,
-	hover-color: $gray-900,
-	focus-bg: $gray-200,
-	focus-color: $gray-900,
-	disabled-bg: transparent,
-	disabled-color: $input-disabled-color,
-), $date-picker-nav-select);
+$date-picker-nav-select: map-deep-merge(
+	(
+		bg: transparent,
+		border-color: transparent,
+		color: $secondary,
+		font-size: $font-size-sm,
+		font-weight: $font-weight-semi-bold,
+		height: $input-height-sm,
+		padding-bottom: 0,
+		padding-left: 0.5rem,
+		padding-top: 0,
+		hover-bg: $gray-200,
+		hover-color: $gray-900,
+		focus-bg: $gray-200,
+		focus-color: $gray-900,
+		disabled-bg: transparent,
+		disabled-color: $input-disabled-color,
+	),
+	$date-picker-nav-select
+);
 
 // Date Picker Calendar Item
 
 $date-picker-date: () !default;
-$date-picker-date: map-deep-merge((
-	hover-color: $gray-900,
-	focus-bg: $gray-200,
-	focus-color: $gray-900,
-	disabled-color: $gray-500,
-	disabled-opacity: null,
-), $date-picker-date);
+$date-picker-date: map-deep-merge(
+	(
+		hover-color: $gray-900,
+		focus-bg: $gray-200,
+		focus-color: $gray-900,
+		disabled-color: $gray-500,
+		disabled-opacity: null,
+	),
+	$date-picker-date
+);
 
 $date-picker-previous-month-date: () !default;
-$date-picker-previous-month-date: map-deep-merge((
-	color: $gray-500,
-	opacity: null,
-	focus-opacity: null,
-	active-opacity: null,
-), $date-picker-previous-month-date);
+$date-picker-previous-month-date: map-deep-merge(
+	(
+		color: $gray-500,
+		opacity: null,
+		focus-opacity: null,
+		active-opacity: null,
+	),
+	$date-picker-previous-month-date
+);
 
 $date-picker-next-month-date: () !default;
-$date-picker-next-month-date: map-deep-merge((
-	color: $gray-500,
-	opacity: null,
-	focus-opacity: null,
-	active-opacity: null,
-), $date-picker-next-month-date);
\ No newline at end of file
+$date-picker-next-month-date: map-deep-merge(
+	(
+		color: $gray-500,
+		opacity: null,
+		focus-opacity: null,
+		active-opacity: null,
+	),
+	$date-picker-next-month-date
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_drilldown.scss b/packages/clay-css/src/scss/atlas/variables/_drilldown.scss
index 37088f73cd..9306262859 100644
--- a/packages/clay-css/src/scss/atlas/variables/_drilldown.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_drilldown.scss
@@ -1,5 +1,8 @@
 $drilldown-item-header: () !default;
-$drilldown-item-header: map-deep-merge((
-	font-weight: $font-weight-semi-bold,
-	text-transform: uppercase,
-), $drilldown-item-header);
\ No newline at end of file
+$drilldown-item-header: map-deep-merge(
+	(
+		font-weight: $font-weight-semi-bold,
+		text-transform: uppercase,
+	),
+	$drilldown-item-header
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_dropdowns.scss b/packages/clay-css/src/scss/atlas/variables/_dropdowns.scss
index aa0218f665..51a062e954 100644
--- a/packages/clay-css/src/scss/atlas/variables/_dropdowns.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_dropdowns.scss
@@ -22,7 +22,7 @@ $dropdown-caption-color: $gray-600 !default;
 $dropdown-link-color: $gray-600 !default;
 $dropdown-link-font-weight: $font-weight-normal !default;
 $dropdown-link-hover-color: $gray-900 !default;
-$dropdown-link-hover-bg: lighten($component-active-bg, 44.90) !default;
+$dropdown-link-hover-bg: lighten($component-active-bg, 44.9) !default;
 $dropdown-link-active-color: $dropdown-link-hover-color !default;
 $dropdown-link-active-bg: $dropdown-link-hover-bg !default;
 $dropdown-link-active-font-weight: $font-weight-semi-bold !default;
@@ -34,47 +34,62 @@ $dropdown-item-padding-y: 0.5rem !default; // 8px
 // Weird box-shadow inset with border-radius render in IE https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/12515080/
 
 $dropdown-item-base: () !default;
-$dropdown-item-base: map-deep-merge((
-	font-size: inherit,
-	focus-box-shadow: $component-focus-inset-box-shadow,
-	focus-outline: 0,
-	focus-text-decoration: none,
-	active-class-c-kbd-inline: (
-		color: $dropdown-link-active-color,
+$dropdown-item-base: map-deep-merge(
+	(
+		font-size: inherit,
+		focus-box-shadow: $component-focus-inset-box-shadow,
+		focus-outline: 0,
+		focus-text-decoration: none,
+		active-class-c-kbd-inline: (
+			color: $dropdown-link-active-color,
+		),
+		disabled-box-shadow: none,
+		c-kbd-inline: (
+			color: $gray-500,
+		),
 	),
-	disabled-box-shadow: none,
-	c-kbd-inline: (
-		color: $gray-500,
-	),
-), $dropdown-item-base);
+	$dropdown-item-base
+);
 
 $dropdown-section-custom-control-label: () !default;
-$dropdown-section-custom-control-label: map-deep-merge((
-	color: $secondary,
-), $dropdown-section-custom-control-label);
+$dropdown-section-custom-control-label: map-deep-merge(
+	(
+		color: $secondary,
+	),
+	$dropdown-section-custom-control-label
+);
 
 $dropdown-section-active-custom-control-label: () !default;
-$dropdown-section-active-custom-control-label: map-deep-merge((
-	color: $gray-900,
-), $dropdown-section-active-custom-control-label);
+$dropdown-section-active-custom-control-label: map-deep-merge(
+	(
+		color: $gray-900,
+	),
+	$dropdown-section-active-custom-control-label
+);
 
 $dropdown-section-custom-control-label-text: () !default;
-$dropdown-section-custom-control-label-text: map-deep-merge((
-	padding-left: 1rem,
-), $dropdown-section-custom-control-label-text);
+$dropdown-section-custom-control-label-text: map-deep-merge(
+	(
+		padding-left: 1rem,
+	),
+	$dropdown-section-custom-control-label-text
+);
 
 $dropdown-divider-bg: $dropdown-border-color !default;
 
 // Autocomplete Dropdown Menu
 
 $autocomplete-dropdown-menu: () !default;
-$autocomplete-dropdown-menu: map-deep-merge((
-	max-height: 10rem,
-), $autocomplete-dropdown-menu);
+$autocomplete-dropdown-menu: map-deep-merge(
+	(
+		max-height: 10rem,
+	),
+	$autocomplete-dropdown-menu
+);
 
 // Dropdown Action
 
 $dropdown-action-toggle-font-size: 1rem !default; // 16px
 $dropdown-action-toggle-size: $btn-monospaced-size-sm !default;
 
-$dropdown-action-toggle-disabled-opacity: $btn-disabled-opacity !default;
\ No newline at end of file
+$dropdown-action-toggle-disabled-opacity: $btn-disabled-opacity !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_forms.scss b/packages/clay-css/src/scss/atlas/variables/_forms.scss
index 0dc6876fcd..805a76ec4d 100644
--- a/packages/clay-css/src/scss/atlas/variables/_forms.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_forms.scss
@@ -56,7 +56,7 @@ $input-box-shadow: 0 0 rgba(0, 0, 0, 0) !default;
 $input-placeholder-color: $gray-600 !default;
 $input-label-color: $gray-900 !default;
 
-$input-focus-bg: lighten($component-active-bg, 44.90) !default;
+$input-focus-bg: lighten($component-active-bg, 44.9) !default;
 $input-focus-border-color: lighten($component-active-bg, 22.94) !default;
 $input-focus-box-shadow: $component-focus-box-shadow !default;
 
@@ -72,17 +72,23 @@ $input-label-disabled-color: $gray-500 !default;
 $input-readonly-bg: $white !default;
 
 $input-readonly: () !default;
-$input-readonly: map-deep-merge((
-	bg: $input-readonly-bg,
-	border-color: $input-border-color,
-	focus-box-shadow: none,
-), $input-readonly);
+$input-readonly: map-deep-merge(
+	(
+		bg: $input-readonly-bg,
+		border-color: $input-border-color,
+		focus-box-shadow: none,
+	),
+	$input-readonly
+);
 
 $input-plaintext-readonly: () !default;
-$input-plaintext-readonly: map-deep-merge((
-	focus-border-color: $input-focus-border-color,
-	focus-box-shadow: none,
-), $input-plaintext-readonly);
+$input-plaintext-readonly: map-deep-merge(
+	(
+		focus-border-color: $input-focus-border-color,
+		focus-box-shadow: none,
+	),
+	$input-plaintext-readonly
+);
 
 $input-danger-bg: $danger-l2 !default;
 $input-danger-border-color: $danger-l1 !default;
@@ -92,15 +98,21 @@ $input-danger-focus-box-shadow: $input-focus-box-shadow !default;
 $input-danger-color: $input-color !default;
 
 $input-danger-readonly: () !default;
-$input-danger-readonly: map-deep-merge((
-	bg: map-get($input-readonly, bg),
-	border-color: map-get($input-readonly, border-color),
-	focus-border-color: $input-focus-border-color,
-), $input-danger-readonly);
+$input-danger-readonly: map-deep-merge(
+	(
+		bg: map-get($input-readonly, bg),
+		border-color: map-get($input-readonly, border-color),
+		focus-border-color: $input-focus-border-color,
+	),
+	$input-danger-readonly
+);
 
 $input-danger-checkbox-label-color: $danger !default;
 $input-danger-select-icon-color: $input-danger-border-color !default;
-$input-danger-select-icon: clay-icon(caret-double-l, $input-danger-select-icon-color) !default;
+$input-danger-select-icon: clay-icon(
+	caret-double-l,
+	$input-danger-select-icon-color
+) !default;
 
 $input-success-bg: $success-l2 !default;
 $input-success-border-color: $success-l1 !default;
@@ -110,15 +122,21 @@ $input-success-focus-box-shadow: $input-focus-box-shadow !default;
 $input-success-color: $input-color !default;
 
 $input-success-readonly: () !default;
-$input-success-readonly: map-deep-merge((
-	bg: map-get($input-readonly, bg),
-	border-color: map-get($input-readonly, border-color),
-	focus-border-color: $input-focus-border-color,
-), $input-success-readonly);
+$input-success-readonly: map-deep-merge(
+	(
+		bg: map-get($input-readonly, bg),
+		border-color: map-get($input-readonly, border-color),
+		focus-border-color: $input-focus-border-color,
+	),
+	$input-success-readonly
+);
 
 $input-success-checkbox-label-color: $success !default;
 $input-success-select-icon-color: $input-success-border-color !default;
-$input-success-select-icon: clay-icon(caret-double-l, $input-success-select-icon-color) !default;
+$input-success-select-icon: clay-icon(
+	caret-double-l,
+	$input-success-select-icon-color
+) !default;
 
 $input-warning-bg: $warning-l2 !default;
 $input-warning-border-color: $warning-l1 !default;
@@ -127,16 +145,22 @@ $input-warning-box-shadow: 0 0 rgba(0, 0, 0, 0) !default;
 $input-warning-focus-box-shadow: $input-focus-box-shadow !default;
 
 $input-warning-readonly: () !default;
-$input-warning-readonly: map-deep-merge((
-	bg: map-get($input-readonly, bg),
-	border-color: map-get($input-readonly, border-color),
-	focus-border-color: $input-focus-border-color,
-), $input-warning-readonly);
+$input-warning-readonly: map-deep-merge(
+	(
+		bg: map-get($input-readonly, bg),
+		border-color: map-get($input-readonly, border-color),
+		focus-border-color: $input-focus-border-color,
+	),
+	$input-warning-readonly
+);
 
 $input-warning-color: $input-color !default;
 $input-warning-checkbox-label-color: $warning !default;
 $input-warning-select-icon-color: $input-warning-border-color !default;
-$input-warning-select-icon: clay-icon(caret-double-l, $input-warning-select-icon-color) !default;
+$input-warning-select-icon: clay-icon(
+	caret-double-l,
+	$input-warning-select-icon-color
+) !default;
 
 // Select Element
 
@@ -145,20 +169,32 @@ $input-select-bg-size: 1.5em auto !default;
 $input-select-padding-right: 2em !default;
 
 $input-select-icon-color: $gray-600 !default;
-$input-select-icon: clay-icon(caret-double-l, $input-select-icon-color) !default;
+$input-select-icon: clay-icon(
+	caret-double-l,
+	$input-select-icon-color
+) !default;
 
 $input-select-icon-focus-color: $input-select-icon-color !default;
-$input-select-icon-focus: clay-icon(caret-double-l, $input-select-icon-focus-color) !default;
+$input-select-icon-focus: clay-icon(
+	caret-double-l,
+	$input-select-icon-focus-color
+) !default;
 
 $input-select-icon-disabled-color: $gray-500 !default;
-$input-select-icon-disabled: clay-icon(caret-double-l, $input-select-icon-disabled-color) !default;
+$input-select-icon-disabled: clay-icon(
+	caret-double-l,
+	$input-select-icon-disabled-color
+) !default;
 
 $input-select-size: () !default;
-$input-select-size: map-deep-merge((
-	option: (
-		padding: 0.25rem 0.5rem,
+$input-select-size: map-deep-merge(
+	(
+		option: (
+			padding: 0.25rem 0.5rem,
+		),
 	),
-), $input-select-size);
+	$input-select-size
+);
 
 // Form Feedback
 
@@ -177,26 +213,30 @@ $input-textarea-height-sm: 80px !default;
 // Form Control Label (Labels inside Form Control Tag Group)
 
 $form-control-label-size: () !default;
-$form-control-label-size: map-deep-merge((
-	border-width: 0.0625rem,
-	font-size: map-get($label-lg, font-size),
-	height: 1.5rem,
-	margin-bottom: 0.3125rem,
-	margin-right: 0.625rem,
-	margin-top: 0.3125rem,
-	padding-x: map-get($label-lg, padding-x),
-	padding-y: map-get($label-lg, padding-y),
-	text-transform: none,
-	item-spacer-y: map-get($label-lg, item-spacer-y),
-	lexicon-icon-height: map-get($label-lg, lexicon-icon-height),
-	lexicon-icon-width: map-get($label-lg, lexicon-icon-width),
-	sticker-size: map-get($label-lg, sticker-size),
-	close: map-get($label-lg, close)
-), $form-control-label-size);
+$form-control-label-size: map-deep-merge(
+	(
+		border-width: 0.0625rem,
+		font-size: map-get($label-lg, font-size),
+		height: 1.5rem,
+		margin-bottom: 0.3125rem,
+		margin-right: 0.625rem,
+		margin-top: 0.3125rem,
+		padding-x: map-get($label-lg, padding-x),
+		padding-y: map-get($label-lg, padding-y),
+		text-transform: none,
+		item-spacer-y: map-get($label-lg, item-spacer-y),
+		lexicon-icon-height: map-get($label-lg, lexicon-icon-height),
+		lexicon-icon-width: map-get($label-lg, lexicon-icon-width),
+		sticker-size: map-get($label-lg, sticker-size),
+		close: map-get($label-lg, close),
+	),
+	$form-control-label-size
+);
 
 // Form Group
 
-$form-group-item-label-spacer: ($input-label-font-size * $line-height-base) + $input-label-margin-bottom !default;
+$form-group-item-label-spacer: ($input-label-font-size * $line-height-base) +
+	$input-label-margin-bottom !default;
 
 // Input Groups
 
@@ -215,4 +255,4 @@ $input-group-addon-min-width-sm: 2rem !default; // 32px
 
 $input-group-secondary-addon-bg: $white !default;
 $input-group-secondary-addon-border-color: $secondary-l2 !default;
-$input-group-secondary-addon-color: $secondary !default;
\ No newline at end of file
+$input-group-secondary-addon-color: $secondary !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_globals.scss b/packages/clay-css/src/scss/atlas/variables/_globals.scss
index cca21465d8..0b163366fc 100644
--- a/packages/clay-css/src/scss/atlas/variables/_globals.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_globals.scss
@@ -19,14 +19,14 @@ $grid-breakpoints: (
 	sm: 576px,
 	md: 768px,
 	lg: 992px,
-	xl: 1280px
+	xl: 1280px,
 ) !default;
 
 $container-max-widths: (
 	sm: 540px,
 	md: 720px,
 	lg: 960px,
-	xl: 1248px
+	xl: 1248px,
 ) !default;
 
 $grid-gutter-width: 24px !default;
@@ -46,7 +46,9 @@ $font-weight-bolder: 900 !default;
 
 $line-height-base: 1.5 !default;
 
-$font-family-sans-serif: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default;
+$font-family-sans-serif: system-ui, -apple-system, BlinkMacSystemFont,
+	'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', Arial,
+	sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol' !default;
 
 $headings-font-weight: $font-weight-bold !default;
 
@@ -59,90 +61,102 @@ $h6-font-size: 0.8125rem !default; // 13px
 
 // Theme Base Colors
 
-$white: #FFF !default;
-$gray-100: #F7F8F9 !default;
-$gray-200: #F1F2F5 !default;
-$gray-300: #E7E7ED !default;
-$gray-400: #CDCED9 !default;
-$gray-500: #A7A9BC !default;
-$gray-600: #6B6C7E !default;
+$white: #fff !default;
+$gray-100: #f7f8f9 !default;
+$gray-200: #f1f2f5 !default;
+$gray-300: #e7e7ed !default;
+$gray-400: #cdced9 !default;
+$gray-500: #a7a9bc !default;
+$gray-600: #6b6c7e !default;
 $gray-700: #495057 !default;
-$gray-800: #393A4A !default;
+$gray-800: #393a4a !default;
 $gray-900: #272833 !default;
 $black: #000 !default;
 
-$blue: if($enable-lexicon-flat-colors, #4B9FFF, #0B5FFF) !default;
-$indigo: if($enable-lexicon-flat-colors, #7785FF, #6610F2) !default;
-$purple: if($enable-lexicon-flat-colors, #AF78FF, #6F42C1) !default;
-$pink: if($enable-lexicon-flat-colors, #FF73C3, #E83E8C) !default;
-$red: if($enable-lexicon-flat-colors, #FF5F5F, #DA1414) !default;
-$orange: if($enable-lexicon-flat-colors, #FFB46E, #B95000) !default;
-$yellow: if($enable-lexicon-flat-colors, #FFD76E, #FFC107) !default;
-$green: if($enable-lexicon-flat-colors, #9BE169, #287D3D) !default;
-$teal: if($enable-lexicon-flat-colors, #50D2A0, #20C997) !default;
-$cyan: if($enable-lexicon-flat-colors, #5FC8FF, #17A2B8) !default;
-
-$primary: #0B5FFF !default;
-$primary-d1: darken($primary, 5.10) !default;
+$blue: if($enable-lexicon-flat-colors, #4b9fff, #0b5fff) !default;
+$indigo: if($enable-lexicon-flat-colors, #7785ff, #6610f2) !default;
+$purple: if($enable-lexicon-flat-colors, #af78ff, #6f42c1) !default;
+$pink: if($enable-lexicon-flat-colors, #ff73c3, #e83e8c) !default;
+$red: if($enable-lexicon-flat-colors, #ff5f5f, #da1414) !default;
+$orange: if($enable-lexicon-flat-colors, #ffb46e, #b95000) !default;
+$yellow: if($enable-lexicon-flat-colors, #ffd76e, #ffc107) !default;
+$green: if($enable-lexicon-flat-colors, #9be169, #287d3d) !default;
+$teal: if($enable-lexicon-flat-colors, #50d2a0, #20c997) !default;
+$cyan: if($enable-lexicon-flat-colors, #5fc8ff, #17a2b8) !default;
+
+$primary: #0b5fff !default;
+$primary-d1: darken($primary, 5.1) !default;
 $primary-d2: darken($primary, 10) !default;
 $primary-l1: lighten($primary, 22.94) !default;
 $primary-l2: lighten($primary, 32.94) !default;
-$primary-l3: lighten($primary, 44.90) !default;
+$primary-l3: lighten($primary, 44.9) !default;
 
-$secondary: #6B6C7E !default;
+$secondary: #6b6c7e !default;
 $secondary-d1: darken(saturate($secondary, 4.82), 20) !default;
 $secondary-d2: darken(saturate($secondary, 5.36), 23.92) !default;
-$secondary-l1: lighten(saturate(adjust-hue($secondary, -3), 5.39), 23.92) !default;
-$secondary-l2: lighten(saturate(adjust-hue($secondary, -2), 5.48), 37.06) !default;
-$secondary-l3: lighten(saturate(adjust-hue($secondary, 3), 6.13), 46.08) !default;
+$secondary-l1: lighten(
+	saturate(adjust-hue($secondary, -3), 5.39),
+	23.92
+) !default;
+$secondary-l2: lighten(
+	saturate(adjust-hue($secondary, -2), 5.48),
+	37.06
+) !default;
+$secondary-l3: lighten(
+	saturate(adjust-hue($secondary, 3), 6.13),
+	46.08
+) !default;
 
-$info: #2E5AAC !default;
+$info: #2e5aac !default;
 $info-d1: darken($info, 5) !default;
 $info-d2: darken($info, 10) !default;
 $info-l1: lighten(saturate($info, 0.59), 28.04) !default;
 $info-l2: lighten(desaturate($info, 3.25), 52.94) !default;
 
-$success: #287D3C !default;
+$success: #287d3c !default;
 $success-d1: darken($success, 5) !default;
 $success-d2: darken($success, 10) !default;
 $success-l1: lighten(desaturate($success, 0.14), 24.95) !default;
 $success-l2: lighten(desaturate($success, 1.52), 62.94) !default;
 
-$warning: #B95000 !default;
-$warning-d1: darken($warning, 5.10) !default;
+$warning: #b95000 !default;
+$warning-d1: darken($warning, 5.1) !default;
 $warning-d2: darken($warning, 10) !default;
-$warning-l1: lighten($warning, 24.90) !default;
+$warning-l1: lighten($warning, 24.9) !default;
 $warning-l2: lighten($warning, 60) !default;
 
-$danger: #DA1414 !default;
+$danger: #da1414 !default;
 $danger-d1: darken($danger, 5) !default;
 $danger-d2: darken($danger, 10) !default;
 $danger-l1: lighten(desaturate($danger, 0.25), 28.04) !default;
 $danger-l2: lighten(saturate($danger, 5.04), 50) !default;
 
-$light: #F1F2F5 !default;
-$light-d1: darken($light, 5.10) !default;
+$light: #f1f2f5 !default;
+$light-d1: darken($light, 5.1) !default;
 $light-d2: darken($light, 10) !default;
 $light-l1: lighten(desaturate(adjust-hue($light, -15), 2.38), 1.96) !default;
 $light-l2: lighten(desaturate(adjust-hue($light, -225), 16.67), 4.71) !default;
 
 $dark: #272833 !default;
-$dark-d1: darken($dark, 5.10) !default;
+$dark-d1: darken($dark, 5.1) !default;
 $dark-d2: darken($dark, 10) !default;
 $dark-l1: lighten(saturate($dark, 0.18), 4.12) !default;
 $dark-l2: lighten(desaturate($dark, 0.36), 8.04) !default;
 
 $theme-colors: () !default;
-$theme-colors: map-deep-merge((
-	primary: $primary,
-	secondary: $secondary,
-	success: $success,
-	info: $info,
-	warning: $warning,
-	danger: $danger,
-	light: $light,
-	dark: $dark
-), $theme-colors);
+$theme-colors: map-deep-merge(
+	(
+		primary: $primary,
+		secondary: $secondary,
+		success: $success,
+		info: $info,
+		warning: $warning,
+		danger: $danger,
+		light: $light,
+		dark: $dark,
+	),
+	$theme-colors
+);
 
 $yiq-text-dark: $gray-900 !default;
 $yiq-text-light: $white !default;
@@ -154,30 +168,50 @@ $text-muted: $gray-500 !default;
 $link-color: $primary !default;
 $link-hover-color: $primary-d2 !default;
 
-$component-active-bg: #0B5FFF !default;
-$component-active-color: #FFF !default;
+$component-active-bg: #0b5fff !default;
+$component-active-color: #fff !default;
 
 $component-focus-box-shadow: 0 0 0 0.125rem $white#{','} 0 0 0 0.25rem $primary-l1 !default;
-$component-focus-inset-box-shadow: inset 0 0 0 0.125rem $primary-l1#{','} inset 0 0 0 0.25rem $white !default;
+$component-focus-inset-box-shadow: inset 0 0 0 0.125rem $primary-l1#{','} inset 0
+	0 0 0.25rem $white !default;
 
 // Spacing
 
 $spacer: 1rem !default;
 $spacers: () !default;
-$spacers: map-deep-merge((
-	0: 0,
-	1: ($spacer * .25),
-	2: ($spacer * .5),
-	3: ($spacer * 1),
-	4: ($spacer * 1.5),
-	5: ($spacer * 3),
-	6: ($spacer * 4.5),
-	7: ($spacer * 6),
-	8: ($spacer * 7.5),
-), $spacers);
+$spacers: map-deep-merge(
+	(
+		0: 0,
+		1: (
+			$spacer * 0.25,
+		),
+		2: (
+			$spacer * 0.5,
+		),
+		3: (
+			$spacer * 1,
+		),
+		4: (
+			$spacer * 1.5,
+		),
+		5: (
+			$spacer * 3,
+		),
+		6: (
+			$spacer * 4.5,
+		),
+		7: (
+			$spacer * 6,
+		),
+		8: (
+			$spacer * 7.5,
+		),
+	),
+	$spacers
+);
 
 $border-radius: 0.25rem !default; // 4px
 $border-radius-lg: 0.375rem !default; // 6px
 $border-radius-sm: 0.1875rem !default; // 3px
 
-$close-text-shadow: none !default;
\ No newline at end of file
+$close-text-shadow: none !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_icons.scss b/packages/clay-css/src/scss/atlas/variables/_icons.scss
index 5c38010aa8..9279db5909 100644
--- a/packages/clay-css/src/scss/atlas/variables/_icons.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_icons.scss
@@ -1,2 +1,2 @@
 $order-arrow-down-active-color: $gray-500 !default;
-$order-arrow-up-active-color: $order-arrow-down-active-color !default;
\ No newline at end of file
+$order-arrow-up-active-color: $order-arrow-down-active-color !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_labels.scss b/packages/clay-css/src/scss/atlas/variables/_labels.scss
index 2c80069fc4..25bf94dfc6 100644
--- a/packages/clay-css/src/scss/atlas/variables/_labels.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_labels.scss
@@ -19,37 +19,45 @@ $label-link-hover-text-decoration: underline !default;
 // Label Close
 
 $label-close: () !default;
-$label-close: map-deep-merge((
-	disabled-color: inherit
-), $label-close);
+$label-close: map-deep-merge(
+	(
+		disabled-color: inherit,
+	),
+	$label-close
+);
 
 // Label Sizes
 
 $label-lg: () !default;
-$label-lg: map-deep-merge((
-	font-size: 0.75rem,
-	height: 1.5rem,
-	padding-x: 0.5rem,
-	padding-y: 0.3125rem,
-	item-spacer-y: -0.0625rem,
-	lexicon-icon-height: 1em,
-	lexicon-icon-width: 1em,
-	sticker-size: 0.875rem,
-	close: (
-		font-size: 0.625rem,
+$label-lg: map-deep-merge(
+	(
+		font-size: 0.75rem,
+		height: 1.5rem,
+		padding-x: 0.5rem,
+		padding-y: 0.3125rem,
+		item-spacer-y: -0.0625rem,
+		lexicon-icon-height: 1em,
+		lexicon-icon-width: 1em,
+		sticker-size: 0.875rem,
+		close: (
+			font-size: 0.625rem,
+		),
 	),
-), $label-lg);
+	$label-lg
+);
 
 // Label Variants
 
 $label-base: () !default;
-$label-base: map-deep-merge((
-	outline: 0,
-	transition: box-shadow 0.15s ease-in-out,
-	focus-box-shadow: $btn-focus-box-shadow,
-	disabled-box-shadow: none,
-), $label-base);
-
+$label-base: map-deep-merge(
+	(
+		outline: 0,
+		transition: box-shadow 0.15s ease-in-out,
+		focus-box-shadow: $btn-focus-box-shadow,
+		disabled-box-shadow: none,
+	),
+	$label-base
+);
 
 // @deprecated as of v2.4.1 use the Sass map `$label-primary` instead
 
@@ -68,12 +76,15 @@ $label-primary-border-color: $primary-l1 !default;
 $label-primary-hover-border-color: $label-primary-border-color !default;
 
 $label-primary: () !default;
-$label-primary: map-deep-merge((
-	border-color: $label-primary-border-color,
-	color: $label-primary-color,
-	hover-border-color: $label-primary-hover-border-color,
-	hover-color: $label-primary-hover-color,
-), $label-primary);
+$label-primary: map-deep-merge(
+	(
+		border-color: $label-primary-border-color,
+		color: $label-primary-color,
+		hover-border-color: $label-primary-hover-border-color,
+		hover-color: $label-primary-hover-color,
+	),
+	$label-primary
+);
 
 // @deprecated as of v2.4.1 use the Sass map `$label-secondary` instead
 
@@ -92,12 +103,15 @@ $label-secondary-border-color: $secondary-l2 !default;
 $label-secondary-hover-border-color: $label-secondary-border-color !default;
 
 $label-secondary: () !default;
-$label-secondary: map-deep-merge((
-	border-color: $label-secondary-border-color,
-	color: $label-secondary-color,
-	hover-border-color: $label-secondary-hover-border-color,
-	hover-color: $label-secondary-hover-color,
-), $label-secondary);
+$label-secondary: map-deep-merge(
+	(
+		border-color: $label-secondary-border-color,
+		color: $label-secondary-color,
+		hover-border-color: $label-secondary-hover-border-color,
+		hover-color: $label-secondary-hover-color,
+	),
+	$label-secondary
+);
 
 // @deprecated as of v2.4.1 use the Sass map `$label-success` instead
 
@@ -116,12 +130,15 @@ $label-success-border-color: $success-l1 !default;
 $label-success-hover-border-color: $label-success-border-color !default;
 
 $label-success: () !default;
-$label-success: map-deep-merge((
-	border-color: $label-success-border-color,
-	color: $label-success-color,
-	hover-border-color: $label-success-hover-border-color,
-	hover-color: $label-success-hover-color,
-), $label-success);
+$label-success: map-deep-merge(
+	(
+		border-color: $label-success-border-color,
+		color: $label-success-color,
+		hover-border-color: $label-success-hover-border-color,
+		hover-color: $label-success-hover-color,
+	),
+	$label-success
+);
 
 // @deprecated as of v2.4.1 use the Sass map `$label-info` instead
 
@@ -140,12 +157,15 @@ $label-info-border-color: $info-l1 !default;
 $label-info-hover-border-color: $label-info-border-color !default;
 
 $label-info: () !default;
-$label-info: map-deep-merge((
-	border-color: $label-info-border-color,
-	color: $label-info-color,
-	hover-border-color: $label-info-hover-border-color,
-	hover-color: $label-info-hover-color,
-), $label-info);
+$label-info: map-deep-merge(
+	(
+		border-color: $label-info-border-color,
+		color: $label-info-color,
+		hover-border-color: $label-info-hover-border-color,
+		hover-color: $label-info-hover-color,
+	),
+	$label-info
+);
 
 // @deprecated as of v2.4.1 use the Sass map `$label-warning` instead
 
@@ -164,12 +184,15 @@ $label-warning-border-color: $warning-l1 !default;
 $label-warning-hover-border-color: $label-warning-border-color !default;
 
 $label-warning: () !default;
-$label-warning: map-deep-merge((
-	border-color: $label-warning-border-color,
-	color: $label-warning-color,
-	hover-border-color: $label-warning-hover-border-color,
-	hover-color: $label-warning-hover-color,
-), $label-warning);
+$label-warning: map-deep-merge(
+	(
+		border-color: $label-warning-border-color,
+		color: $label-warning-color,
+		hover-border-color: $label-warning-hover-border-color,
+		hover-color: $label-warning-hover-color,
+	),
+	$label-warning
+);
 
 // @deprecated as of v2.4.1 use the Sass map `$label-danger` instead
 
@@ -188,12 +211,15 @@ $label-danger-border-color: $danger-l1 !default;
 $label-danger-hover-border-color: $label-danger-border-color !default;
 
 $label-danger: () !default;
-$label-danger: map-deep-merge((
-	border-color: $label-danger-border-color,
-	color: $label-danger-color,
-	hover-border-color: $label-danger-hover-border-color,
-	hover-color: $label-danger-hover-color,
-), $label-danger);
+$label-danger: map-deep-merge(
+	(
+		border-color: $label-danger-border-color,
+		color: $label-danger-color,
+		hover-border-color: $label-danger-hover-border-color,
+		hover-color: $label-danger-hover-color,
+	),
+	$label-danger
+);
 
 // @deprecated as of v2.4.1 use the Sass map `$label-light` instead
 
@@ -216,13 +242,16 @@ $label-light-border-color: $light !default;
 $label-light-hover-border-color: $label-light-border-color !default;
 
 $label-light: () !default;
-$label-light: map-deep-merge((
-	bg: $label-light-bg,
-	border-color: $label-light-border-color,
-	color: $label-light-color,
-	hover-border-color: $label-light-hover-border-color,
-	hover-color: $label-light-hover-color,
-), $label-light);
+$label-light: map-deep-merge(
+	(
+		bg: $label-light-bg,
+		border-color: $label-light-border-color,
+		color: $label-light-color,
+		hover-border-color: $label-light-hover-border-color,
+		hover-color: $label-light-hover-color,
+	),
+	$label-light
+);
 
 // @deprecated as of v2.4.1 use the Sass map `$label-dark` instead
 
@@ -241,139 +270,166 @@ $label-dark-border-color: $dark !default;
 $label-dark-hover-border-color: $label-dark-border-color !default;
 
 $label-dark: () !default;
-$label-dark: map-deep-merge((
-	border-color: $label-dark-border-color,
-	color: $label-dark-color,
-	hover-border-color: $label-dark-hover-border-color,
-	hover-color: $label-dark-hover-color,
-), $label-dark);
+$label-dark: map-deep-merge(
+	(
+		border-color: $label-dark-border-color,
+		color: $label-dark-color,
+		hover-border-color: $label-dark-hover-border-color,
+		hover-color: $label-dark-hover-color,
+	),
+	$label-dark
+);
 
 // Label Inverse Variants
 
 $label-inverse-primary: () !default;
-$label-inverse-primary: map-deep-merge((
-	color: $white,
-	hover: (
-		background-color: null,
-		border-color: null,
+$label-inverse-primary: map-deep-merge(
+	(
 		color: $white,
+		hover: (
+			background-color: null,
+			border-color: null,
+			color: $white,
+		),
+		link-hover: (
+			color: null,
+		),
+		close: (
+			hover-color: null,
+		),
 	),
-	link-hover: (
-		color: null,
-	),
-	close: (
-		hover-color: null,
-	),
-), $label-inverse-primary);
+	$label-inverse-primary
+);
 
 $label-inverse-secondary: () !default;
-$label-inverse-secondary: map-deep-merge((
-	color: $white,
-	hover: (
-		background-color: null,
-		border-color: null,
+$label-inverse-secondary: map-deep-merge(
+	(
 		color: $white,
+		hover: (
+			background-color: null,
+			border-color: null,
+			color: $white,
+		),
+		link-hover: (
+			color: null,
+		),
+		close: (
+			hover-color: null,
+		),
 	),
-	link-hover: (
-		color: null,
-	),
-	close: (
-		hover-color: null,
-	),
-), $label-inverse-secondary);
+	$label-inverse-secondary
+);
 
 $label-inverse-success: () !default;
-$label-inverse-success: map-deep-merge((
-	color: $white,
-	hover: (
-		background-color: null,
-		border-color: null,
+$label-inverse-success: map-deep-merge(
+	(
 		color: $white,
+		hover: (
+			background-color: null,
+			border-color: null,
+			color: $white,
+		),
+		link-hover: (
+			color: null,
+		),
+		close: (
+			hover-color: null,
+		),
 	),
-	link-hover: (
-		color: null,
-	),
-	close: (
-		hover-color: null,
-	),
-), $label-inverse-success);
+	$label-inverse-success
+);
 
 $label-inverse-info: () !default;
-$label-inverse-info: map-deep-merge((
-	color: $white,
-	hover: (
-		background-color: null,
-		border-color: null,
+$label-inverse-info: map-deep-merge(
+	(
 		color: $white,
+		hover: (
+			background-color: null,
+			border-color: null,
+			color: $white,
+		),
+		link-hover: (
+			color: null,
+		),
+		close: (
+			hover-color: null,
+		),
 	),
-	link-hover: (
-		color: null,
-	),
-	close: (
-		hover-color: null,
-	),
-), $label-inverse-info);
+	$label-inverse-info
+);
 
 $label-inverse-warning: () !default;
-$label-inverse-warning: map-deep-merge((
-	color: $white,
-	hover: (
-		background-color: null,
-		border-color: null,
+$label-inverse-warning: map-deep-merge(
+	(
 		color: $white,
+		hover: (
+			background-color: null,
+			border-color: null,
+			color: $white,
+		),
+		link-hover: (
+			color: null,
+		),
+		close: (
+			hover-color: null,
+		),
 	),
-	link-hover: (
-		color: null,
-	),
-	close: (
-		hover-color: null,
-	),
-), $label-inverse-warning);
+	$label-inverse-warning
+);
 
 $label-inverse-danger: () !default;
-$label-inverse-danger: map-deep-merge((
-	color: $white,
-	hover: (
-		background-color: null,
-		border-color: null,
+$label-inverse-danger: map-deep-merge(
+	(
 		color: $white,
+		hover: (
+			background-color: null,
+			border-color: null,
+			color: $white,
+		),
+		link-hover: (
+			color: null,
+		),
+		close: (
+			hover-color: null,
+		),
 	),
-	link-hover: (
-		color: null,
-	),
-	close: (
-		hover-color: null,
-	),
-), $label-inverse-danger);
+	$label-inverse-danger
+);
 
 $label-inverse-light: () !default;
-$label-inverse-light: map-deep-merge((
-	color: $dark,
-	hover: (
-		background-color: null,
-		border-color: null,
+$label-inverse-light: map-deep-merge(
+	(
 		color: $dark,
+		hover: (
+			background-color: null,
+			border-color: null,
+			color: $dark,
+		),
+		link-hover: (
+			color: null,
+		),
+		close: (
+			hover-color: null,
+		),
 	),
-	link-hover: (
-		color: null,
-	),
-	close: (
-		hover-color: null,
-	),
-), $label-inverse-light);
+	$label-inverse-light
+);
 
 $label-inverse-dark: () !default;
-$label-inverse-dark: map-deep-merge((
-	color: $white,
-	hover: (
-		background-color: null,
-		border-color: null,
+$label-inverse-dark: map-deep-merge(
+	(
 		color: $white,
+		hover: (
+			background-color: null,
+			border-color: null,
+			color: $white,
+		),
+		link-hover: (
+			color: null,
+		),
+		close: (
+			hover-color: null,
+		),
 	),
-	link-hover: (
-		color: null,
-	),
-	close: (
-		hover-color: null,
-	),
-), $label-inverse-dark);
+	$label-inverse-dark
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_links.scss b/packages/clay-css/src/scss/atlas/variables/_links.scss
index 319c1b301d..50c59d405e 100644
--- a/packages/clay-css/src/scss/atlas/variables/_links.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_links.scss
@@ -1,115 +1,146 @@
 $component-link: () !default;
-$component-link: map-deep-merge((
-	border-radius: 1px,
-	transition: box-shadow 0.15s ease-in-out,
-	focus-color: darken($gray-600, 15%),
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $component-link);
+$component-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		transition: box-shadow 0.15s ease-in-out,
+		focus-color: darken($gray-600, 15%),
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$component-link
+);
 
 $link-primary: () !default;
-$link-primary: map-deep-merge((
-	border-radius: 1px,
-	transition: box-shadow 0.15s ease-in-out,
-	focus-color: darken($primary, 15%),
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $link-primary);
+$link-primary: map-deep-merge(
+	(
+		border-radius: 1px,
+		transition: box-shadow 0.15s ease-in-out,
+		focus-color: darken($primary, 15%),
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$link-primary
+);
 
 $link-secondary: () !default;
-$link-secondary: map-deep-merge((
-	border-radius: 1px,
-	transition: box-shadow 0.15s ease-in-out,
-	hover-color: $gray-900,
-	focus-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $link-secondary);
+$link-secondary: map-deep-merge(
+	(
+		border-radius: 1px,
+		transition: box-shadow 0.15s ease-in-out,
+		hover-color: $gray-900,
+		focus-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$link-secondary
+);
 
 // Component Title
 
 $component-title: () !default;
-$component-title: map-deep-merge((
-	font-size: 1rem,
-	line-height: 1.25,
-	margin-bottom: calc((#{$dropdown-action-toggle-size} - (1em * 1.25)) / 2),
-	margin-top: calc((#{$dropdown-action-toggle-size} - (1em * 1.25)) / 2)
-), $component-title);
+$component-title: map-deep-merge(
+	(
+		font-size: 1rem,
+		line-height: 1.25,
+		margin-bottom:
+			calc((#{$dropdown-action-toggle-size} - (1em * 1.25)) / 2),
+		margin-top: calc((#{$dropdown-action-toggle-size} - (1em * 1.25)) / 2),
+	),
+	$component-title
+);
 
 $component-title-link: () !default;
-$component-title-link: map-deep-merge((
-	border-radius: 1px,
-	transition: box-shadow 0.15s ease-in-out,
-	focus-color: darken($gray-900, 15%),
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $component-title-link);
+$component-title-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		transition: box-shadow 0.15s ease-in-out,
+		focus-color: darken($gray-900, 15%),
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$component-title-link
+);
 
 // Component Subtitle
 
 $component-subtitle: () !default;
-$component-subtitle: map-deep-merge((
-	font-weight: $font-weight-semi-bold,
-	line-height: 1.45
-), $component-subtitle);
+$component-subtitle: map-deep-merge(
+	(
+		font-weight: $font-weight-semi-bold,
+		line-height: 1.45,
+	),
+	$component-subtitle
+);
 
 $component-subtitle-link: () !default;
-$component-subtitle-link: map-deep-merge((
-	border-radius: 1px,
-	transition: box-shadow 0.15s ease-in-out,
-	hover-color: $gray-900,
-	focus-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $component-subtitle-link);
+$component-subtitle-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		transition: box-shadow 0.15s ease-in-out,
+		hover-color: $gray-900,
+		focus-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$component-subtitle-link
+);
 
 // Component Action
 
 $component-action: () !default;
-$component-action: map-deep-merge((
-	font-size: 1rem,
-	hover-bg: rgba($gray-900, 0.03),
-	hover-color: $gray-900,
-	focus-bg: rgba($gray-900, 0.03),
-	focus-box-shadow: map-get($btn-secondary, focus-box-shadow),
-	focus-color: $gray-900,
-	focus-outline: 0,
-	active-bg: rgba($gray-900, 0.06),
-	active-color: $gray-900,
-	btn-focus-box-shadow: map-get($btn-secondary, focus-box-shadow),
-	disabled-bg: transparent,
-	disabled-box-shadow: none,
-), $component-action);
+$component-action: map-deep-merge(
+	(
+		font-size: 1rem,
+		hover-bg: rgba($gray-900, 0.03),
+		hover-color: $gray-900,
+		focus-bg: rgba($gray-900, 0.03),
+		focus-box-shadow: map-get($btn-secondary, focus-box-shadow),
+		focus-color: $gray-900,
+		focus-outline: 0,
+		active-bg: rgba($gray-900, 0.06),
+		active-color: $gray-900,
+		btn-focus-box-shadow: map-get($btn-secondary, focus-box-shadow),
+		disabled-bg: transparent,
+		disabled-box-shadow: none,
+	),
+	$component-action
+);
 
 // Link Outline
 
 $link-outline-primary: () !default;
-$link-outline-primary: map-deep-merge((
-	hover-bg: $primary-l3,
-	hover-color: $primary,
-	focus-bg: $primary-l3,
-	focus-box-shadow: map-get($btn-outline-primary, focus-box-shadow),
-	focus-color: $primary,
-	focus-outline: 0,
-	btn-focus-box-shadow: map-get($btn-outline-primary, focus-box-shadow),
-	btn-focus-outline: 0,
-	active-bg: lighten(desaturate($primary, 42.05), 41.76),
-	active-color: $primary,
-	disabled-box-shadow: none,
-), $link-outline-primary);
+$link-outline-primary: map-deep-merge(
+	(
+		hover-bg: $primary-l3,
+		hover-color: $primary,
+		focus-bg: $primary-l3,
+		focus-box-shadow: map-get($btn-outline-primary, focus-box-shadow),
+		focus-color: $primary,
+		focus-outline: 0,
+		btn-focus-box-shadow: map-get($btn-outline-primary, focus-box-shadow),
+		btn-focus-outline: 0,
+		active-bg: lighten(desaturate($primary, 42.05), 41.76),
+		active-color: $primary,
+		disabled-box-shadow: none,
+	),
+	$link-outline-primary
+);
 
 $link-outline-secondary: () !default;
-$link-outline-secondary: map-deep-merge((
-	border-color: $secondary-l2,
-	hover-bg: rgba($gray-900, 0.03),
-	hover-color: $gray-900,
-	focus-bg: rgba($gray-900, 0.03),
-	focus-box-shadow: map-get($btn-outline-secondary, focus-box-shadow),
-	focus-color: $gray-900,
-	focus-outline: 0,
-	btn-focus-box-shadow: map-get($btn-outline-secondary, focus-box-shadow),
-	btn-focus-outline: 0,
-	active-bg: rgba($gray-900, 0.06),
-	active-color: $gray-900,
-	disabled-box-shadow: none,
-), $link-outline-secondary);
\ No newline at end of file
+$link-outline-secondary: map-deep-merge(
+	(
+		border-color: $secondary-l2,
+		hover-bg: rgba($gray-900, 0.03),
+		hover-color: $gray-900,
+		focus-bg: rgba($gray-900, 0.03),
+		focus-box-shadow: map-get($btn-outline-secondary, focus-box-shadow),
+		focus-color: $gray-900,
+		focus-outline: 0,
+		btn-focus-box-shadow: map-get($btn-outline-secondary, focus-box-shadow),
+		btn-focus-outline: 0,
+		active-bg: rgba($gray-900, 0.06),
+		active-color: $gray-900,
+		disabled-box-shadow: none,
+	),
+	$link-outline-secondary
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_list-group.scss b/packages/clay-css/src/scss/atlas/variables/_list-group.scss
index a3ffe4a504..0dbb483eba 100644
--- a/packages/clay-css/src/scss/atlas/variables/_list-group.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_list-group.scss
@@ -1,6 +1,6 @@
 $list-group-border-color: $gray-300 !default;
 $list-group-color: $gray-600 !default;
-$list-group-hover-bg: lighten($component-active-bg, 44.90) !default;
+$list-group-hover-bg: lighten($component-active-bg, 44.9) !default;
 $list-group-active-bg: $list-group-hover-bg !default;
 $list-group-active-border-color: $list-group-border-color !default;
 $list-group-active-color: $gray-900 !default;
@@ -15,79 +15,103 @@ $list-group-header-bg: $gray-100 !default;
 $list-group-header-padding-y: 0.5rem !default; // 8px
 
 $list-group-header-title: () !default;
-$list-group-header-title: map-deep-merge((
-	color: $gray-600,
-	font-size: 0.75rem,
-	text-transform: uppercase
-), $list-group-header-title);
+$list-group-header-title: map-deep-merge(
+	(
+		color: $gray-600,
+		font-size: 0.75rem,
+		text-transform: uppercase,
+	),
+	$list-group-header-title
+);
 
 // List Group Title
 
 $list-group-title-link: () !default;
-$list-group-title-link: map-deep-merge((
-	border-radius: 1px,
-	display: inline-block,
-	transition: box-shadow 0.15s ease-in-out,
-	hover-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $list-group-title-link);
+$list-group-title-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		display: inline-block,
+		transition: box-shadow 0.15s ease-in-out,
+		hover-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$list-group-title-link
+);
 
 $list-group-title: () !default;
-$list-group-title: map-deep-merge((
-	color: $gray-900,
-	font-size: 0.875rem,
-	line-height: 1.45
-), $list-group-title);
+$list-group-title: map-deep-merge(
+	(
+		color: $gray-900,
+		font-size: 0.875rem,
+		line-height: 1.45,
+	),
+	$list-group-title
+);
 
 // List Group Subtitle
 
 $list-group-subtitle-link: () !default;
-$list-group-subtitle-link: map-deep-merge((
-	border-radius: 1px,
-	display: inline-block,
-	max-width: 100%,
-	transition: box-shadow 0.15s ease-in-out,
-	hover-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $list-group-subtitle-link);
+$list-group-subtitle-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		display: inline-block,
+		max-width: 100%,
+		transition: box-shadow 0.15s ease-in-out,
+		hover-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$list-group-subtitle-link
+);
 
 // List Group Text
 
 $list-group-text-link: () !default;
-$list-group-text-link: map-deep-merge((
-	border-radius: 1px,
-	display: inline-block,
-	max-width: 100%,
-	transition: box-shadow 0.15s ease-in-out,
-	hover-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $list-group-text-link);
+$list-group-text-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		display: inline-block,
+		max-width: 100%,
+		transition: box-shadow 0.15s ease-in-out,
+		hover-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$list-group-text-link
+);
 
 $list-group-text: () !default;
-$list-group-text: map-deep-merge((
-	line-height: 1.45
-), $list-group-text);
+$list-group-text: map-deep-merge(
+	(
+		line-height: 1.45,
+	),
+	$list-group-text
+);
 
 // List Group Subtext
 
 $list-group-subtext-link: () !default;
-$list-group-subtext-link: map-deep-merge((
-	border-radius: 1px,
-	display: inline-block,
-	max-width: 100%,
-	transition: box-shadow 0.15s ease-in-out,
-	hover-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $list-group-subtext-link);
+$list-group-subtext-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		display: inline-block,
+		max-width: 100%,
+		transition: box-shadow 0.15s ease-in-out,
+		hover-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$list-group-subtext-link
+);
 
 $list-group-subtext: () !default;
-$list-group-subtext: map-deep-merge((
-	line-height: 1.45
-), $list-group-subtext);
+$list-group-subtext: map-deep-merge(
+	(
+		line-height: 1.45,
+	),
+	$list-group-subtext
+);
 
 $list-group-subtext-active-color: $gray-600 !default;
 
@@ -100,7 +124,10 @@ $list-group-link-active-color: $list-group-link-color !default;
 // List Group Notification
 
 $list-group-notification-item-primary: () !default;
-$list-group-notification-item-primary: map-deep-merge((
-	border-left-color: lighten($component-active-bg, 22.94),
-	active-border-left-color: lighten($component-active-bg, 22.94)
-), $list-group-notification-item-primary);
\ No newline at end of file
+$list-group-notification-item-primary: map-deep-merge(
+	(
+		border-left-color: lighten($component-active-bg, 22.94),
+		active-border-left-color: lighten($component-active-bg, 22.94),
+	),
+	$list-group-notification-item-primary
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_loaders.scss b/packages/clay-css/src/scss/atlas/variables/_loaders.scss
index d83fa4036b..b483ecaa62 100644
--- a/packages/clay-css/src/scss/atlas/variables/_loaders.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_loaders.scss
@@ -1,4 +1,7 @@
 $loading-animation: () !default;
-$loading-animation: map-deep-merge((
-	color: $gray-600
-), $loading-animation);
\ No newline at end of file
+$loading-animation: map-deep-merge(
+	(
+		color: $gray-600,
+	),
+	$loading-animation
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_management-bar.scss b/packages/clay-css/src/scss/atlas/variables/_management-bar.scss
index db2bf31bc5..eebbe44889 100644
--- a/packages/clay-css/src/scss/atlas/variables/_management-bar.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_management-bar.scss
@@ -1,32 +1,41 @@
 $management-bar-base: () !default;
-$management-bar-base: map-deep-merge((
-	link-border-radius: $border-radius,
-	link-outline: 0,
-	link-transition: box-shadow 0.15s ease-in-out,
-	link-focus-box-shadow: $btn-focus-box-shadow,
-	link-disabled-box-shadow: none,
-), $management-bar-base);
+$management-bar-base: map-deep-merge(
+	(
+		link-border-radius: $border-radius,
+		link-outline: 0,
+		link-transition: box-shadow 0.15s ease-in-out,
+		link-focus-box-shadow: $btn-focus-box-shadow,
+		link-disabled-box-shadow: none,
+	),
+	$management-bar-base
+);
 
 $management-bar-light: () !default;
-$management-bar-light: map-deep-merge((
-	bg: $white,
-	link-font-weight: $font-weight-semi-bold,
-	link-hover-color: $gray-900,
-	link-hover-bg: rgba($gray-900, 0.03),
-	link-focus-color: $gray-900,
-	link-focus-bg: rgba($gray-900, 0.03),
-	link-active-bg: rgba($gray-900, 0.06),
-	link-disabled-bg: transparent,
-), $management-bar-light);
+$management-bar-light: map-deep-merge(
+	(
+		bg: $white,
+		link-font-weight: $font-weight-semi-bold,
+		link-hover-color: $gray-900,
+		link-hover-bg: rgba($gray-900, 0.03),
+		link-focus-color: $gray-900,
+		link-focus-bg: rgba($gray-900, 0.03),
+		link-active-bg: rgba($gray-900, 0.06),
+		link-disabled-bg: transparent,
+	),
+	$management-bar-light
+);
 
 $management-bar-primary: () !default;
-$management-bar-primary: map-deep-merge((
-	link-border-radius: $border-radius,
-	link-font-weight: $font-weight-semi-bold,
-	link-hover-color: $gray-900,
-	link-hover-bg: rgba($gray-900, 0.03),
-	link-focus-color: $gray-900,
-	link-focus-bg: rgba($gray-900, 0.03),
-	link-active-bg: rgba($gray-900, 0.06),
-	link-disabled-bg: transparent,
-), $management-bar-primary);
\ No newline at end of file
+$management-bar-primary: map-deep-merge(
+	(
+		link-border-radius: $border-radius,
+		link-font-weight: $font-weight-semi-bold,
+		link-hover-color: $gray-900,
+		link-hover-bg: rgba($gray-900, 0.03),
+		link-focus-color: $gray-900,
+		link-focus-bg: rgba($gray-900, 0.03),
+		link-active-bg: rgba($gray-900, 0.06),
+		link-disabled-bg: transparent,
+	),
+	$management-bar-primary
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_menubar.scss b/packages/clay-css/src/scss/atlas/variables/_menubar.scss
index fb8b73b9bd..2e3cba5bf9 100644
--- a/packages/clay-css/src/scss/atlas/variables/_menubar.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_menubar.scss
@@ -1,67 +1,75 @@
 // Menubar Vertical MD
 
 $menubar-vertical-transparent-md: () !default;
-$menubar-vertical-transparent-md: map-deep-merge((
-	bg-mobile: $white,
-	link-border-radius: 0.375rem,
-	link-border-radius-mobile: 0,
-	link-hover-bg: rgba($gray-900, 0.03),
-	link-hover-color: $gray-900,
-	link-active-font-weight: $font-weight-semi-bold,
-	link: (
-		transition: $btn-transition,
-		focus-bg: rgba($gray-900, 0.03),
-		focus-color: $gray-900,
-		focus-box-shadow: map-get($dropdown-item-base, focus-box-shadow),
-		focus-outline: map-get($dropdown-item-base, focus-outline),
-		disabled-box-shadow: none,
+$menubar-vertical-transparent-md: map-deep-merge(
+	(
+		bg-mobile: $white,
+		link-border-radius: 0.375rem,
+		link-border-radius-mobile: 0,
+		link-hover-bg: rgba($gray-900, 0.03),
+		link-hover-color: $gray-900,
+		link-active-font-weight: $font-weight-semi-bold,
+		link: (
+			transition: $btn-transition,
+			focus-bg: rgba($gray-900, 0.03),
+			focus-color: $gray-900,
+			focus-box-shadow: map-get($dropdown-item-base, focus-box-shadow),
+			focus-outline: map-get($dropdown-item-base, focus-outline),
+			disabled-box-shadow: none,
+		),
+		link-mobile: (
+			transition: none,
+			focus-bg: $dropdown-link-hover-bg,
+			focus-border-radius:
+				map-get($dropdown-item-base, focus-border-radius),
+		),
+		toggler-font-size-mobile: 0.875rem,
+		toggler-font-weight-mobile: $font-weight-semi-bold,
+		toggler-mobile: (
+			border-radius: 0.375rem,
+			transition: box-shadow 0.15s ease-in-out,
+			focus-box-shadow: $component-focus-box-shadow,
+			focus-outline: 0,
+			disabled-box-shadow: none,
+		),
 	),
-	link-mobile: (
-		transition: none,
-		focus-bg: $dropdown-link-hover-bg,
-		focus-border-radius: map-get($dropdown-item-base, focus-border-radius),
-	),
-	toggler-font-size-mobile: 0.875rem,
-	toggler-font-weight-mobile: $font-weight-semi-bold,
-	toggler-mobile: (
-		border-radius: 0.375rem,
-		transition: box-shadow 0.15s ease-in-out,
-		focus-box-shadow: $component-focus-box-shadow,
-		focus-outline: 0,
-		disabled-box-shadow: none,
-	),
-), $menubar-vertical-transparent-md);
+	$menubar-vertical-transparent-md
+);
 
 // Menubar Vertical LG
 
 $menubar-vertical-transparent-lg: () !default;
-$menubar-vertical-transparent-lg: map-deep-merge((
-	bg-mobile: $white,
-	link-border-radius: 0.375rem,
-	link-border-radius-mobile: 0,
-	link-hover-bg: rgba($gray-900, 0.03),
-	link-hover-color: $gray-900,
-	link-active-font-weight: $font-weight-semi-bold,
-	link: (
-		transition: $btn-transition,
-		focus-bg: rgba($gray-900, 0.03),
-		focus-color: $gray-900,
-		focus-box-shadow: map-get($dropdown-item-base, focus-box-shadow),
-		focus-outline: map-get($dropdown-item-base, focus-outline),
-		disabled-box-shadow: none,
-	),
-	link-mobile: (
-		transition: none,
-		focus-bg: $dropdown-link-hover-bg,
-		focus-border-radius: map-get($dropdown-item-base, focus-border-radius),
-	),
-	toggler-font-size-mobile: 0.875rem,
-	toggler-font-weight-mobile: $font-weight-semi-bold,
-	toggler-mobile: (
-		border-radius: 0.375rem,
-		transition: box-shadow 0.15s ease-in-out,
-		focus-box-shadow: $component-focus-box-shadow,
-		focus-outline: 0,
-		disabled-box-shadow: none,
+$menubar-vertical-transparent-lg: map-deep-merge(
+	(
+		bg-mobile: $white,
+		link-border-radius: 0.375rem,
+		link-border-radius-mobile: 0,
+		link-hover-bg: rgba($gray-900, 0.03),
+		link-hover-color: $gray-900,
+		link-active-font-weight: $font-weight-semi-bold,
+		link: (
+			transition: $btn-transition,
+			focus-bg: rgba($gray-900, 0.03),
+			focus-color: $gray-900,
+			focus-box-shadow: map-get($dropdown-item-base, focus-box-shadow),
+			focus-outline: map-get($dropdown-item-base, focus-outline),
+			disabled-box-shadow: none,
+		),
+		link-mobile: (
+			transition: none,
+			focus-bg: $dropdown-link-hover-bg,
+			focus-border-radius:
+				map-get($dropdown-item-base, focus-border-radius),
+		),
+		toggler-font-size-mobile: 0.875rem,
+		toggler-font-weight-mobile: $font-weight-semi-bold,
+		toggler-mobile: (
+			border-radius: 0.375rem,
+			transition: box-shadow 0.15s ease-in-out,
+			focus-box-shadow: $component-focus-box-shadow,
+			focus-outline: 0,
+			disabled-box-shadow: none,
+		),
 	),
-), $menubar-vertical-transparent-lg);
\ No newline at end of file
+	$menubar-vertical-transparent-lg
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_modals.scss b/packages/clay-css/src/scss/atlas/variables/_modals.scss
index 0755f033d4..181603ac7b 100644
--- a/packages/clay-css/src/scss/atlas/variables/_modals.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_modals.scss
@@ -20,59 +20,71 @@ $modal-title-font-weight: $font-weight-bold !default;
 // Modal Success
 
 $modal-success: () !default;
-$modal-success: map-deep-merge((
-	header-bg: $success-l2,
-	header-border-color: $success-l1,
-	header-color: $success,
-	header-close: (
-		color: $success,
-		hover-color: inherit,
-		focus-color: inherit,
-		disabled-color: inherit
-	)
-), $modal-success);
+$modal-success: map-deep-merge(
+	(
+		header-bg: $success-l2,
+		header-border-color: $success-l1,
+		header-color: $success,
+		header-close: (
+			color: $success,
+			hover-color: inherit,
+			focus-color: inherit,
+			disabled-color: inherit,
+		),
+	),
+	$modal-success
+);
 
 // Modal Info
 
 $modal-info: () !default;
-$modal-info: map-deep-merge((
-	header-bg: $info-l2,
-	header-border-color: $info-l1,
-	header-color: $info,
-	header-close: (
-		color: $info,
-		hover-color: inherit,
-		focus-color: inherit,
-		disabled-color: inherit
-	)
-), $modal-info);
+$modal-info: map-deep-merge(
+	(
+		header-bg: $info-l2,
+		header-border-color: $info-l1,
+		header-color: $info,
+		header-close: (
+			color: $info,
+			hover-color: inherit,
+			focus-color: inherit,
+			disabled-color: inherit,
+		),
+	),
+	$modal-info
+);
 
 // Modal Warning
 
 $modal-warning: () !default;
-$modal-warning: map-deep-merge((
-	header-bg: $warning-l2,
-	header-border-color: $warning-l1,
-	header-color: $warning,
-	header-close: (
-		color: $warning,
-		hover-color: inherit,
-		focus-color: inherit,
-		disabled-color: inherit
-	)
-), $modal-warning);
+$modal-warning: map-deep-merge(
+	(
+		header-bg: $warning-l2,
+		header-border-color: $warning-l1,
+		header-color: $warning,
+		header-close: (
+			color: $warning,
+			hover-color: inherit,
+			focus-color: inherit,
+			disabled-color: inherit,
+		),
+	),
+	$modal-warning
+);
 
 // Modal Danger
 
 $modal-danger: () !default;
-$modal-danger: map-deep-merge((
-	header-bg: $danger-l2,
-	header-border-color: $danger-l1,
-	header-color: $danger,
-	header-close: (
-		color: $danger,
-		hover-color: inherit,
-		focus-color: inherit,
-		disabled-color: inherit
-	)
-), $modal-danger);
\ No newline at end of file
+$modal-danger: map-deep-merge(
+	(
+		header-bg: $danger-l2,
+		header-border-color: $danger-l1,
+		header-color: $danger,
+		header-close: (
+			color: $danger,
+			hover-color: inherit,
+			focus-color: inherit,
+			disabled-color: inherit,
+		),
+	),
+	$modal-danger
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_multi-step-nav.scss b/packages/clay-css/src/scss/atlas/variables/_multi-step-nav.scss
index 6824fde339..135bf8b6c7 100644
--- a/packages/clay-css/src/scss/atlas/variables/_multi-step-nav.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_multi-step-nav.scss
@@ -15,4 +15,4 @@ $multi-step-title-font-size: 0.875rem !default;
 $multi-step-title-font-weight: $font-weight-semi-bold !default;
 
 $multi-step-icon-disabled-bg: $multi-step-icon-bg !default;
-$multi-step-icon-disabled-color: $gray-500 !default;
\ No newline at end of file
+$multi-step-icon-disabled-color: $gray-500 !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_navbar.scss b/packages/clay-css/src/scss/atlas/variables/_navbar.scss
index 3b7500eb6b..98637f329d 100644
--- a/packages/clay-css/src/scss/atlas/variables/_navbar.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_navbar.scss
@@ -14,4 +14,4 @@ $navbar-light-disabled-color: $nav-link-disabled-color !default;
 $navbar-dark-color: $white !default;
 $navbar-dark-hover-color: $navbar-dark-color !default;
 $navbar-dark-active-color: $navbar-dark-color !default;
-$navbar-dark-disabled-color: $nav-link-disabled-color !default;
\ No newline at end of file
+$navbar-dark-disabled-color: $nav-link-disabled-color !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_navigation-bar.scss b/packages/clay-css/src/scss/atlas/variables/_navigation-bar.scss
index 1a0ed2e39c..180f28b622 100644
--- a/packages/clay-css/src/scss/atlas/variables/_navigation-bar.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_navigation-bar.scss
@@ -1,41 +1,52 @@
 $navigation-bar-size: () !default;
-$navigation-bar-size: map-deep-merge((
-	border-bottom-width: 0,
-	collapse-dropdown-item-padding-y-mobile: 0.8125rem,
-	link-height-mobile: 2rem,
-	active-border-offset-bottom: -0.5rem,
-	toggler-link-height: 2rem,
-	toggler-link-margin-y: 0.5rem,
-	toggler-link-padding-y: 0,
-), $navigation-bar-size);
+$navigation-bar-size: map-deep-merge(
+	(
+		border-bottom-width: 0,
+		collapse-dropdown-item-padding-y-mobile: 0.8125rem,
+		link-height-mobile: 2rem,
+		active-border-offset-bottom: -0.5rem,
+		toggler-link-height: 2rem,
+		toggler-link-margin-y: 0.5rem,
+		toggler-link-padding-y: 0,
+	),
+	$navigation-bar-size
+);
 
 $navigation-bar-base: () !default;
-$navigation-bar-base: map-deep-merge((
-	link-border-radius: 0,
-	link-outline: 0,
-	link-focus-box-shadow: $btn-focus-box-shadow,
-	link-disabled-box-shadow: none,
-), $navigation-bar-base);
+$navigation-bar-base: map-deep-merge(
+	(
+		link-border-radius: 0,
+		link-outline: 0,
+		link-focus-box-shadow: $btn-focus-box-shadow,
+		link-disabled-box-shadow: none,
+	),
+	$navigation-bar-base
+);
 
 $navigation-bar-light: () !default;
-$navigation-bar-light: map-deep-merge((
-	bg: $white,
-	link-font-weight: $font-weight-semi-bold,
-	link-hover-color: $gray-900,
-	link-focus-color: $gray-900,
-	link-disabled-color: $gray-600,
-	link-disabled-opacity: $btn-disabled-opacity,
-), $navigation-bar-light);
-
+$navigation-bar-light: map-deep-merge(
+	(
+		bg: $white,
+		link-font-weight: $font-weight-semi-bold,
+		link-hover-color: $gray-900,
+		link-focus-color: $gray-900,
+		link-disabled-color: $gray-600,
+		link-disabled-opacity: $btn-disabled-opacity,
+	),
+	$navigation-bar-light
+);
 
 $navigation-bar-secondary: () !default;
-$navigation-bar-secondary: map-deep-merge((
-	bg: $secondary-d1,
-	link-color: $secondary-l2,
-	link-font-weight: $font-weight-semi-bold,
-	link-hover-color: $white,
-	link-focus-color: $white,
-	link-active-color: $white,
-	link-disabled-color: $gray-400,
-	link-disabled-opacity: $btn-disabled-opacity,
-), $navigation-bar-secondary);
\ No newline at end of file
+$navigation-bar-secondary: map-deep-merge(
+	(
+		bg: $secondary-d1,
+		link-color: $secondary-l2,
+		link-font-weight: $font-weight-semi-bold,
+		link-hover-color: $white,
+		link-focus-color: $white,
+		link-active-color: $white,
+		link-disabled-color: $gray-400,
+		link-disabled-opacity: $btn-disabled-opacity,
+	),
+	$navigation-bar-secondary
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_navs.scss b/packages/clay-css/src/scss/atlas/variables/_navs.scss
index 282a970e72..67ba590cf9 100644
--- a/packages/clay-css/src/scss/atlas/variables/_navs.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_navs.scss
@@ -6,14 +6,20 @@ $nav-link-padding-x: 1rem !default; // 16px
 $nav-link-padding-y: 0.625rem !default; // 10px
 
 $nav-link: () !default;
-$nav-link: map-deep-merge((
-	disabled-box-shadow: none,
-), $nav-link);
+$nav-link: map-deep-merge(
+	(
+		disabled-box-shadow: none,
+	),
+	$nav-link
+);
 
 $nav-link-btn-unstyled: () !default;
-$nav-link-btn-unstyled: map-deep-merge((
-	focus-box-shadow: 0 0 0 0.125rem $white#{','} 0 0 0 0.25rem $primary-l1,
-), $nav-link-btn-unstyled);
+$nav-link-btn-unstyled: map-deep-merge(
+	(
+		focus-box-shadow: 0 0 0 0.125rem $white#{','} 0 0 0 0.25rem $primary-l1,
+	),
+	$nav-link-btn-unstyled
+);
 
 // Nav Nested
 
@@ -36,19 +42,23 @@ $nav-tabs-link-active-border-color: transparent transparent $body-bg !default;
 $nav-tabs-link-active-color: $gray-900 !default;
 
 $nav-tabs-link: () !default;
-$nav-tabs-link: map-deep-merge((
-	font-weight: $font-weight-semi-bold,
-	transition: box-shadow 0.15s ease-in-out,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-	disabled-box-shadow: none,
-), $nav-tabs-link);
+$nav-tabs-link: map-deep-merge(
+	(
+		font-weight: $font-weight-semi-bold,
+		transition: box-shadow 0.15s ease-in-out,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+		disabled-box-shadow: none,
+	),
+	$nav-tabs-link
+);
 
 // Nav Tabs Link Show
 
 $nav-tabs-link-show-color: $nav-tabs-link-active-color !default;
 $nav-tabs-link-show-bg: transparent !default;
-$nav-tabs-link-show-border-color: transparent transparent $nav-tabs-border-color transparent !default;
+$nav-tabs-link-show-border-color: transparent transparent $nav-tabs-border-color
+	transparent !default;
 
 // Nav Tabs Tab Pane
 
@@ -65,17 +75,20 @@ $nav-underline-link-active-color: $gray-900 !default;
 $nav-underline-link-disabled-color: $nav-link-disabled-color !default;
 
 $nav-underline-link: () !default;
-$nav-underline-link: map-deep-merge((
-	border-radius: 1px,
-	font-weight: $font-weight-semi-bold,
-	line-height: 1,
-	padding-bottom: 0.5625rem,
-	padding-top: 0.5625rem,
-	transition: box-shadow 0.15s ease-in-out,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-	disabled-box-shadow: none,
-), $nav-underline-link);
+$nav-underline-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		font-weight: $font-weight-semi-bold,
+		line-height: 1,
+		padding-bottom: 0.5625rem,
+		padding-top: 0.5625rem,
+		transition: box-shadow 0.15s ease-in-out,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+		disabled-box-shadow: none,
+	),
+	$nav-underline-link
+);
 
 // Nav Underline Link Highlight
 
@@ -83,4 +96,4 @@ $nav-underline-link-highlight-left: 0 !default;
 $nav-underline-link-highlight-right: 0 !default;
 
 $nav-underline-link-active-highlight: $primary-l1 !default;
-$nav-underline-link-active-highlight-height: 0.125rem !default; // 2px
\ No newline at end of file
+$nav-underline-link-active-highlight-height: 0.125rem !default; // 2px
diff --git a/packages/clay-css/src/scss/atlas/variables/_pagination.scss b/packages/clay-css/src/scss/atlas/variables/_pagination.scss
index de63693f0d..523fe557e4 100644
--- a/packages/clay-css/src/scss/atlas/variables/_pagination.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_pagination.scss
@@ -50,11 +50,14 @@ $pagination-disabled-color: $gray-600 !default;
 $pagination-disabled-opacity: 0.5 !default;
 
 $pagination-link-focus: () !default;
-$pagination-link-focus: map-deep-merge((
-	bg: $pagination-hover-bg,
-	border-color: $pagination-hover-border-color,
-	color: $pagination-hover-color,
-), $pagination-link-focus);
+$pagination-link-focus: map-deep-merge(
+	(
+		bg: $pagination-hover-bg,
+		border-color: $pagination-hover-border-color,
+		color: $pagination-hover-color,
+	),
+	$pagination-link-focus
+);
 
 // Pagination Dropdown Menu
 
@@ -63,11 +66,14 @@ $pagination-dropdown-menu-spacer-y: 0.625rem !default; // 10px
 // Pagination Items Per Page Link
 
 $pagination-items-per-page-link-focus: () !default;
-$pagination-items-per-page-link-focus: map-deep-merge((
-	bg: map-get($pagination-link-focus, bg),
-	border-color: map-get($pagination-link-focus, border-color),
-	color: map-get($pagination-link-focus, color),
-), $pagination-items-per-page-link-focus);
+$pagination-items-per-page-link-focus: map-deep-merge(
+	(
+		bg: map-get($pagination-link-focus, bg),
+		border-color: map-get($pagination-link-focus, border-color),
+		color: map-get($pagination-link-focus, color),
+	),
+	$pagination-items-per-page-link-focus
+);
 
 // Pagination Results
 
@@ -84,4 +90,4 @@ $pagination-link-border-radius-lg: 0.3125rem !default; // 5px
 $pagination-font-size-lg: 1.125rem !default; // 18px
 $pagination-item-height-lg: 2.75rem !default; //44px
 $pagination-padding-x-lg: 1rem !default; // 16px
-$pagination-padding-y-lg: 0 !default;
\ No newline at end of file
+$pagination-padding-y-lg: 0 !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_panels.scss b/packages/clay-css/src/scss/atlas/variables/_panels.scss
index dea409299b..b0ac084ba2 100644
--- a/packages/clay-css/src/scss/atlas/variables/_panels.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_panels.scss
@@ -7,17 +7,23 @@ $panel-header-link-hover-text-decoration: none !default;
 $panel-header-collapse-icon-font-size: 0.75rem !default; // 12px
 
 $panel-header-link: () !default;
-$panel-header-link: map-deep-merge((
-	transition: box-shadow 0.15s ease-in-out,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $panel-header-link);
+$panel-header-link: map-deep-merge(
+	(
+		transition: box-shadow 0.15s ease-in-out,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$panel-header-link
+);
 
 $panel-header-collapsed-link: () !default;
-$panel-header-collapsed-link: map-deep-merge((
-	border-color: null,
-	transition: null,
-), $panel-header-collapsed-link);
+$panel-header-collapsed-link: map-deep-merge(
+	(
+		border-color: null,
+		transition: null,
+	),
+	$panel-header-collapsed-link
+);
 
 // Panel Footer
 
@@ -36,26 +42,35 @@ $panel-title-small-margin-left: 0.375rem !default; // 6px
 // Panel Group Sm
 
 $panel-group-sm: () !default;
-$panel-group-sm: map-deep-merge((
-	title-font-size: 0.75rem,
-), $panel-group-sm);
+$panel-group-sm: map-deep-merge(
+	(
+		title-font-size: 0.75rem,
+	),
+	$panel-group-sm
+);
 
 // Panel Variants
 
 $panel-secondary: () !default;
-$panel-secondary: map-deep-merge((
-	border-color: $gray-300,
-	color: $gray-600,
-	header-bg: null,
-	header-border-color: $gray-300,
-	footer-bg: null,
-	footer-border-color: $gray-300,
-), $panel-secondary);
+$panel-secondary: map-deep-merge(
+	(
+		border-color: $gray-300,
+		color: $gray-600,
+		header-bg: null,
+		header-border-color: $gray-300,
+		footer-bg: null,
+		footer-border-color: $gray-300,
+	),
+	$panel-secondary
+);
 
 // Panel Unstyled
 
 $panel-unstyled-header-link: () !default;
-$panel-unstyled-header-link: map-deep-merge((
-	border-radius: 1px,
-	focus-box-shadow: 0 0 0 0.25rem $body-bg#{','} 0 0 0 0.375rem $primary-l1,
-), $panel-unstyled-header-link);
\ No newline at end of file
+$panel-unstyled-header-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		focus-box-shadow: 0 0 0 0.25rem $body-bg#{','} 0 0 0 0.375rem $primary-l1,
+	),
+	$panel-unstyled-header-link
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_popovers.scss b/packages/clay-css/src/scss/atlas/variables/_popovers.scss
index 28eea227fa..9c858ffd0d 100644
--- a/packages/clay-css/src/scss/atlas/variables/_popovers.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_popovers.scss
@@ -20,4 +20,4 @@ $popover-header-padding-y: 0.75rem !default; // 12px
 
 $popover-body-color: $gray-600 !default;
 $popover-body-padding-x: 1rem !default; // 16px
-$popover-body-padding-y: 0.75rem !default; // 12px
\ No newline at end of file
+$popover-body-padding-y: 0.75rem !default; // 12px
diff --git a/packages/clay-css/src/scss/atlas/variables/_progress-bars.scss b/packages/clay-css/src/scss/atlas/variables/_progress-bars.scss
index 0051ba15f1..6d2bc6c9d8 100644
--- a/packages/clay-css/src/scss/atlas/variables/_progress-bars.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_progress-bars.scss
@@ -10,10 +10,13 @@ $progress-border-radius-lg: 100px !default;
 // Progress Group
 
 $progress-group-subtitle: () !default;
-$progress-group-subtitle: map-deep-merge((
-	font-size: 0.75rem,
-	font-weight: $font-weight-normal
-), $progress-group-subtitle);
+$progress-group-subtitle: map-deep-merge(
+	(
+		font-size: 0.75rem,
+		font-weight: $font-weight-normal,
+	),
+	$progress-group-subtitle
+);
 
 $progress-group-addon-font-size: 0.875rem !default;
-$progress-group-addon-font-weight: $font-weight-semi-bold !default;
\ No newline at end of file
+$progress-group-addon-font-weight: $font-weight-semi-bold !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_quick-action.scss b/packages/clay-css/src/scss/atlas/variables/_quick-action.scss
index 22e9fd0cee..77655ee189 100644
--- a/packages/clay-css/src/scss/atlas/variables/_quick-action.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_quick-action.scss
@@ -1,3 +1,3 @@
 $quick-action-font-size: 1rem !default; // 16px
 
-$quick-action-item-disabled-opacity: $btn-disabled-opacity !default;
\ No newline at end of file
+$quick-action-item-disabled-opacity: $btn-disabled-opacity !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_range.scss b/packages/clay-css/src/scss/atlas/variables/_range.scss
index 23f7416b3e..8b23e77a6b 100644
--- a/packages/clay-css/src/scss/atlas/variables/_range.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_range.scss
@@ -1,16 +1,22 @@
 $clay-range-disabled-color: $gray-500 !default;
 
 $clay-range-input-group-text: () !default;
-$clay-range-input-group-text: map-deep-merge((
-	color: $gray-500,
-), $clay-range-input-group-text);
+$clay-range-input-group-text: map-deep-merge(
+	(
+		color: $gray-500,
+	),
+	$clay-range-input-group-text
+);
 
 $clay-range-input: () !default;
-$clay-range-input: map-deep-merge((
-	color: $gray-500,
-	thumb-box-shadow: 0 1px 5px -1px rgba(0, 0, 0, 0.3),
-	track-bg: $gray-200,
-	tooltip-padding: 0.5rem 0.75rem,
-	hover-thumb-bg: $primary-l3,
-	disabled-thumb-bg: $gray-100,
-), $clay-range-input);
\ No newline at end of file
+$clay-range-input: map-deep-merge(
+	(
+		color: $gray-500,
+		thumb-box-shadow: 0 1px 5px -1px rgba(0, 0, 0, 0.3),
+		track-bg: $gray-200,
+		tooltip-padding: 0.5rem 0.75rem,
+		hover-thumb-bg: $primary-l3,
+		disabled-thumb-bg: $gray-100,
+	),
+	$clay-range-input
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_reorder.scss b/packages/clay-css/src/scss/atlas/variables/_reorder.scss
index aef3f48750..cbc6b43c77 100644
--- a/packages/clay-css/src/scss/atlas/variables/_reorder.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_reorder.scss
@@ -1,4 +1,7 @@
 $clay-reorder-underlay-focus: () !default;
-$clay-reorder-underlay-focus: map-deep-merge((
-	box-shadow: null,
-), $clay-reorder-underlay-focus);
\ No newline at end of file
+$clay-reorder-underlay-focus: map-deep-merge(
+	(
+		box-shadow: null,
+	),
+	$clay-reorder-underlay-focus
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_sheets.scss b/packages/clay-css/src/scss/atlas/variables/_sheets.scss
index 8fa31ffc45..1d6ad703e1 100644
--- a/packages/clay-css/src/scss/atlas/variables/_sheets.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_sheets.scss
@@ -32,12 +32,15 @@ $sheet-subtitle-margin-bottom-mobile: 1rem !default; // 16px
 // Sheet Subtitle as Panel Header
 
 $sheet-subtitle-link: () !default;
-$sheet-subtitle-link: map-deep-merge((
-	border-radius: 1px,
-	transition: box-shadow 0.15s ease-in-out,
-	focus-box-shadow: 0 0 0 0.25rem $white#{','} 0 0 0 0.375rem $primary-l1,
-	focus-outline: 0,
-), $sheet-subtitle-link);
+$sheet-subtitle-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		transition: box-shadow 0.15s ease-in-out,
+		focus-box-shadow: 0 0 0 0.25rem $white#{','} 0 0 0 0.375rem $primary-l1,
+		focus-outline: 0,
+	),
+	$sheet-subtitle-link
+);
 
 $sheet-subtitle-collapse-icon-font-size: 0.75rem !default;
 
@@ -47,4 +50,4 @@ $sheet-tertiary-title-margin-bottom-mobile: 0.5rem !default; // 8px
 
 $sheet-text-color: $gray-600 !default;
 
-$sheet-text-margin-bottom-mobile: 1rem !default; // 16px
\ No newline at end of file
+$sheet-text-margin-bottom-mobile: 1rem !default; // 16px
diff --git a/packages/clay-css/src/scss/atlas/variables/_sidebar.scss b/packages/clay-css/src/scss/atlas/variables/_sidebar.scss
index 31379601d3..e4e69e2a37 100644
--- a/packages/clay-css/src/scss/atlas/variables/_sidebar.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_sidebar.scss
@@ -1,32 +1,44 @@
 // Sidebar Header Title
 
 $sidebar-header-component-title: () !default;
-$sidebar-header-component-title: map-deep-merge((
-	// 20px
-	font-size: 1.25rem,
-), $sidebar-header-component-title);
+$sidebar-header-component-title: map-deep-merge(
+	(
+		// 20px
+			font-size: 1.25rem
+	),
+	$sidebar-header-component-title
+);
 
 // Sidebar Header Subtitle
 
 $sidebar-header-component-subtitle: () !default;
-$sidebar-header-component-subtitle: map-deep-merge((
-	font-size: 0.75rem,
-	font-weight: $font-weight-normal
-), $sidebar-header-component-subtitle);
+$sidebar-header-component-subtitle: map-deep-merge(
+	(
+		font-size: 0.75rem,
+		font-weight: $font-weight-normal,
+	),
+	$sidebar-header-component-subtitle
+);
 
 // Sidebar DT
 
 $sidebar-dt: () !default;
-$sidebar-dt: map-deep-merge((
-	font-size: 0.75rem,
-), $sidebar-dt);
+$sidebar-dt: map-deep-merge(
+	(
+		font-size: 0.75rem,
+	),
+	$sidebar-dt
+);
 
 // Sidebar DD
 
 $sidebar-dd: () !default;
-$sidebar-dd: map-deep-merge((
-	font-size: 0.875rem,
-), $sidebar-dd);
+$sidebar-dd: map-deep-merge(
+	(
+		font-size: 0.875rem,
+	),
+	$sidebar-dd
+);
 
 // Sidebar List Group
 
@@ -35,28 +47,34 @@ $sidebar-list-group-border-color: $secondary-l2 !default;
 // Sidebar Light
 
 $sidebar-light: () !default;
-$sidebar-light: map-deep-merge((
-	bg: $white,
-	border-left-width: 0,
-	box-shadow: -0.25rem 0 0.5rem -0.25rem rgba(0, 0, 0, 0.1),
-	panel-bg: $gray-200,
-	dt: (
-		color: $gray-600
-	),
-	dd: (
-		clay-link: (
-			color: $gray-900
-		)
-	),
-	panel-unstyled: (
-		header-link: (
-			focus-box-shadow: 0 0 0 0.25rem $white#{','} 0 0 0 0.375rem $primary-l1,
+$sidebar-light: map-deep-merge(
+	(
+		bg: $white,
+		border-left-width: 0,
+		box-shadow: -0.25rem 0 0.5rem -0.25rem rgba(0, 0, 0, 0.1),
+		panel-bg: $gray-200,
+		dt: (
+			color: $gray-600,
+		),
+		dd: (
+			clay-link: (
+				color: $gray-900,
+			),
+		),
+		panel-unstyled: (
+			header-link: (
+				focus-box-shadow: 0 0 0 0.25rem $white#{','} 0 0 0 0.375rem $primary-l1,
+			),
 		),
 	),
-), $sidebar-light);
+	$sidebar-light
+);
 
 $sidebar-light-navigation-bar: () !default;
-$sidebar-light-navigation-bar: map-deep-merge((
-	bg: $white,
-	border-color: $secondary-l2
-), $sidebar-light-navigation-bar);
\ No newline at end of file
+$sidebar-light-navigation-bar: map-deep-merge(
+	(
+		bg: $white,
+		border-color: $secondary-l2,
+	),
+	$sidebar-light-navigation-bar
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_stickers.scss b/packages/clay-css/src/scss/atlas/variables/_stickers.scss
index b85a7d586e..9b7ee99ee6 100644
--- a/packages/clay-css/src/scss/atlas/variables/_stickers.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_stickers.scss
@@ -4,19 +4,28 @@ $sticker-font-weight: $font-weight-bold !default;
 // Sticker Sizes
 
 $sticker-sm: () !default;
-$sticker-sm: map-deep-merge((
-	font-size: 0.75rem,
-), $sticker-sm);
+$sticker-sm: map-deep-merge(
+	(
+		font-size: 0.75rem,
+	),
+	$sticker-sm
+);
 
 $sticker-lg: () !default;
-$sticker-lg: map-deep-merge((
-	font-size: 1.25rem,
-), $sticker-lg);
+$sticker-lg: map-deep-merge(
+	(
+		font-size: 1.25rem,
+	),
+	$sticker-lg
+);
 
 $sticker-xl: () !default;
-$sticker-xl: map-deep-merge((
-	font-size: 1.5rem,
-), $sticker-xl);
+$sticker-xl: map-deep-merge(
+	(
+		font-size: 1.5rem,
+	),
+	$sticker-xl
+);
 
 // Sticker Positions
 
@@ -25,9 +34,12 @@ $sticker-inside-offset: 1rem !default; // 16px
 // Sticker User Icon
 
 $sticker-user-icon: () !default;
-$sticker-user-icon: map-deep-merge((
-	box-shadow: 0 0 0 1px $gray-300,
-), $sticker-user-icon);
+$sticker-user-icon: map-deep-merge(
+	(
+		box-shadow: 0 0 0 1px $gray-300,
+	),
+	$sticker-user-icon
+);
 
 // Sticker Variants
 
@@ -53,4 +65,4 @@ $sticker-light-bg: $white !default;
 $sticker-light-color: $dark !default;
 
 $sticker-dark-bg: $dark !default;
-$sticker-dark-color: $white !default;
\ No newline at end of file
+$sticker-dark-color: $white !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_tables.scss b/packages/clay-css/src/scss/atlas/variables/_tables.scss
index 592c04aa05..c4004a9886 100644
--- a/packages/clay-css/src/scss/atlas/variables/_tables.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_tables.scss
@@ -1,6 +1,6 @@
 $table-bg: $white !default;
 $table-accent-bg: $gray-100 !default;
-$table-hover-bg: lighten($component-active-bg, 44.90) !default;
+$table-hover-bg: lighten($component-active-bg, 44.9) !default;
 $table-border-color: $gray-300 !default;
 $table-font-size: 0.875rem !default;
 
@@ -12,14 +12,17 @@ $table-head-color: $gray-600 !default;
 $table-head-font-weight: $font-weight-semi-bold !default;
 
 $table-head-link: () !default;
-$table-head-link: map-deep-merge((
-	border-radius: 1px,
-	color: $gray-600,
-	transition: box-shadow 0.15s ease-in-out,
-	hover-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $table-head-link);
+$table-head-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		color: $gray-600,
+		transition: box-shadow 0.15s ease-in-out,
+		hover-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$table-head-link
+);
 
 $table-divider-bg: $gray-100 !default;
 $table-divider-color: $gray-600 !default;
@@ -36,50 +39,62 @@ $table-quick-action-menu-hover-bg: $table-hover-bg !default;
 // Table Title
 
 $table-title-link: () !default;
-$table-title-link: map-deep-merge((
-	border-radius: 1px,
-	display: inline-block,
-	max-width: 100%,
-	transition: box-shadow 0.15s ease-in-out,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $table-title-link);
+$table-title-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		display: inline-block,
+		max-width: 100%,
+		transition: box-shadow 0.15s ease-in-out,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$table-title-link
+);
 
 $table-title: () !default;
-$table-title: map-deep-merge((
-	color: $gray-900,
-	font-size: 0.875rem,
-), $table-title);
+$table-title: map-deep-merge(
+	(
+		color: $gray-900,
+		font-size: 0.875rem,
+	),
+	$table-title
+);
 
 // Table Action Link
 
 $table-action-link: () !default;
-$table-action-link: map-deep-merge((
-	color: $gray-600,
-	font-size: 1rem,
-	transition: $btn-transition,
-	hover-bg: rgba(0, 0, 0, 0.02),
-	hover-color: $gray-900,
-	focus-bg: rgba(0, 0, 0, 0.02),
-	focus-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-	active-bg: rgba(0, 0, 0, 0.04),
-), $table-action-link);
+$table-action-link: map-deep-merge(
+	(
+		color: $gray-600,
+		font-size: 1rem,
+		transition: $btn-transition,
+		hover-bg: rgba(0, 0, 0, 0.02),
+		hover-color: $gray-900,
+		focus-bg: rgba(0, 0, 0, 0.02),
+		focus-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+		active-bg: rgba(0, 0, 0, 0.04),
+	),
+	$table-action-link
+);
 
 // Table Link
 
 $table-link: () !default;
-$table-link: map-deep-merge((
-	border-radius: 1px,
-	color: $gray-900,
-	display: inline-block,
-	max-width: 100%,
-	transition: box-shadow 0.15s ease-in-out,
-	hover-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $table-link);
+$table-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		color: $gray-900,
+		display: inline-block,
+		max-width: 100%,
+		transition: box-shadow 0.15s ease-in-out,
+		hover-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$table-link
+);
 
 // Table List
 
@@ -101,50 +116,62 @@ $table-list-divider-padding-y: 0.4375rem !default; // 7px
 // Table List Title
 
 $table-list-title: () !default;
-$table-list-title: map-deep-merge((
-	color: $gray-900,
-	font-size: 0.875rem,
-	line-height: 1.45
-), $table-list-title);
+$table-list-title: map-deep-merge(
+	(
+		color: $gray-900,
+		font-size: 0.875rem,
+		line-height: 1.45,
+	),
+	$table-list-title
+);
 
 $table-list-title-link: () !default;
-$table-list-title-link: map-deep-merge((
-	border-radius: 1px,
-	color: $gray-900,
-	display: inline-block,
-	max-width: 100%,
-	transition: box-shadow 0.15s ease-in-out,
-	hover-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $table-list-title-link);
+$table-list-title-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		color: $gray-900,
+		display: inline-block,
+		max-width: 100%,
+		transition: box-shadow 0.15s ease-in-out,
+		hover-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$table-list-title-link
+);
 
 // Table List Link
 
 $table-list-link: () !default;
-$table-list-link: map-deep-merge((
-	border-radius: 1px,
-	color: $gray-900,
-	display: inline-block,
-	max-width: 100%,
-	transition: box-shadow 0.15s ease-in-out,
-	hover-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-), $table-list-link);
+$table-list-link: map-deep-merge(
+	(
+		border-radius: 1px,
+		color: $gray-900,
+		display: inline-block,
+		max-width: 100%,
+		transition: box-shadow 0.15s ease-in-out,
+		hover-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$table-list-link
+);
 
 // Table List Action Link
 
 $table-list-action-link: () !default;
-$table-list-action-link: map-deep-merge((
-	color: $gray-600,
-	font-size: 1rem,
-	transition: $btn-transition,
-	hover-bg: rgba(0, 0, 0, 0.02),
-	hover-color: $gray-900,
-	focus-bg: rgba(0, 0, 0, 0.02),
-	focus-color: $gray-900,
-	focus-box-shadow: $component-focus-box-shadow,
-	focus-outline: 0,
-	active-bg: rgba(0, 0, 0, 0.04),
-), $table-list-action-link);
\ No newline at end of file
+$table-list-action-link: map-deep-merge(
+	(
+		color: $gray-600,
+		font-size: 1rem,
+		transition: $btn-transition,
+		hover-bg: rgba(0, 0, 0, 0.02),
+		hover-color: $gray-900,
+		focus-bg: rgba(0, 0, 0, 0.02),
+		focus-color: $gray-900,
+		focus-box-shadow: $component-focus-box-shadow,
+		focus-outline: 0,
+		active-bg: rgba(0, 0, 0, 0.04),
+	),
+	$table-list-action-link
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_tbar.scss b/packages/clay-css/src/scss/atlas/variables/_tbar.scss
index a32208d703..6a691a841f 100644
--- a/packages/clay-css/src/scss/atlas/variables/_tbar.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_tbar.scss
@@ -1,37 +1,55 @@
 $component-tbar: () !default;
-$component-tbar: map-deep-merge((
-	border-color: $gray-300,
-	color: $gray-600,
-), $component-tbar);
+$component-tbar: map-deep-merge(
+	(
+		border-color: $gray-300,
+		color: $gray-600,
+	),
+	$component-tbar
+);
 
 // Subnav Tbar Primary
 
 $subnav-tbar-primary-component-link: () !default;
-$subnav-tbar-primary-component-link: map-deep-merge((
-	disabled-opacity: 0.65
-), $subnav-tbar-primary-component-link);
+$subnav-tbar-primary-component-link: map-deep-merge(
+	(
+		disabled-opacity: 0.65,
+	),
+	$subnav-tbar-primary-component-link
+);
 
 $subnav-tbar-primary-component-label-close: () !default;
-$subnav-tbar-primary-component-label-close: map-deep-merge((
-	disabled-opacity: 0.65
-), $subnav-tbar-primary-component-label-close);
+$subnav-tbar-primary-component-label-close: map-deep-merge(
+	(
+		disabled-opacity: 0.65,
+	),
+	$subnav-tbar-primary-component-label-close
+);
 
 // Subnav Tbar Primary Disabled
 
 $subnav-tbar-primary-disabled-component-label: () !default;
-$subnav-tbar-primary-disabled-component-label: map-deep-merge((
-	border-color: #8E94AA
-), $subnav-tbar-primary-disabled-component-label);
+$subnav-tbar-primary-disabled-component-label: map-deep-merge(
+	(
+		border-color: #8e94aa,
+	),
+	$subnav-tbar-primary-disabled-component-label
+);
 
 $subnav-tbar-primary-disabled: () !default;
-$subnav-tbar-primary-disabled: map-deep-merge((
-	color: #8E94AA
-), $subnav-tbar-primary-disabled);
+$subnav-tbar-primary-disabled: map-deep-merge(
+	(
+		color: #8e94aa,
+	),
+	$subnav-tbar-primary-disabled
+);
 
 // Subnav Tbar Light
 
 $subnav-tbar-light: () !default;
-$subnav-tbar-light: map-deep-merge((
-	bg-color: $light-l2,
-	color: $gray-600,
-), $subnav-tbar-light);
\ No newline at end of file
+$subnav-tbar-light: map-deep-merge(
+	(
+		bg-color: $light-l2,
+		color: $gray-600,
+	),
+	$subnav-tbar-light
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_time.scss b/packages/clay-css/src/scss/atlas/variables/_time.scss
index 150c4aa1a8..3e31654761 100644
--- a/packages/clay-css/src/scss/atlas/variables/_time.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_time.scss
@@ -1,10 +1,16 @@
 $clay-time-btn: () !default;
-$clay-time-btn: map-deep-merge((
-	color: $secondary,
-	focus-box-shadow: 0 0 0 1px #80ACFF,
-), $clay-time-btn);
+$clay-time-btn: map-deep-merge(
+	(
+		color: $secondary,
+		focus-box-shadow: 0 0 0 1px #80acff,
+	),
+	$clay-time-btn
+);
 
 $clay-time-inner-spin: () !default;
-$clay-time-inner-spin: map-deep-merge((
-	border-color: $secondary-l2,
-), $clay-time-inner-spin);
\ No newline at end of file
+$clay-time-inner-spin: map-deep-merge(
+	(
+		border-color: $secondary-l2,
+	),
+	$clay-time-inner-spin
+);
diff --git a/packages/clay-css/src/scss/atlas/variables/_timelines.scss b/packages/clay-css/src/scss/atlas/variables/_timelines.scss
index fb63f7019c..6d3fde28fe 100644
--- a/packages/clay-css/src/scss/atlas/variables/_timelines.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_timelines.scss
@@ -1,3 +1,3 @@
 $timeline-border-color: $gray-900 !default;
 $timeline-icon-border-color: $gray-600 !default;
-$timeline-increment-label-color: $gray-600 !default;
\ No newline at end of file
+$timeline-increment-label-color: $gray-600 !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_toggle-switch.scss b/packages/clay-css/src/scss/atlas/variables/_toggle-switch.scss
index 12bad2472a..dadfc9693d 100644
--- a/packages/clay-css/src/scss/atlas/variables/_toggle-switch.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_toggle-switch.scss
@@ -5,8 +5,10 @@ $toggle-switch-bar-padding-mobile: 4px !default;
 $toggle-switch-button-width: 24px !default; // 24px
 $toggle-switch-button-width-mobile: 16px !default; // 16px
 
-$toggle-switch-bar-height: ($toggle-switch-bar-padding * 2) + $toggle-switch-button-width !default;
-$toggle-switch-bar-height-mobile: ($toggle-switch-bar-padding-mobile * 2) + $toggle-switch-button-width-mobile !default;
+$toggle-switch-bar-height: ($toggle-switch-bar-padding * 2) +
+	$toggle-switch-button-width !default;
+$toggle-switch-bar-height-mobile: ($toggle-switch-bar-padding-mobile * 2) +
+	$toggle-switch-button-width-mobile !default;
 
 $toggle-switch-bar-width: 60px !default; // width of switch bar
 $toggle-switch-bar-width-mobile: 44px !default; // width of switch bar
@@ -37,4 +39,4 @@ $toggle-switch-bar-on-icon-color: $white !default;
 $toggle-switch-button-on-bg: $white !default;
 $toggle-switch-button-on-border-color: $white !default;
 $toggle-switch-button-on-border-radius: $toggle-switch-button-border-radius !default;
-$toggle-switch-button-on-icon-color: $gray-900 !default;
\ No newline at end of file
+$toggle-switch-button-on-icon-color: $gray-900 !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_tooltip.scss b/packages/clay-css/src/scss/atlas/variables/_tooltip.scss
index d83d2f0f7d..5a1629f1bd 100644
--- a/packages/clay-css/src/scss/atlas/variables/_tooltip.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_tooltip.scss
@@ -6,4 +6,4 @@ $tooltip-opacity: 1 !default;
 $tooltip-padding-x: 0.75rem !default; // 12px
 $tooltip-padding-y: 0.75rem !default; // 12px
 
-$tooltip-arrow-offset: 0.5rem !default; // 8px
\ No newline at end of file
+$tooltip-arrow-offset: 0.5rem !default; // 8px
diff --git a/packages/clay-css/src/scss/atlas/variables/_type.scss b/packages/clay-css/src/scss/atlas/variables/_type.scss
index 7634de0691..9f1a136527 100644
--- a/packages/clay-css/src/scss/atlas/variables/_type.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_type.scss
@@ -2,4 +2,4 @@ $b-font-weight: $font-weight-semi-bold !default;
 
 $strong-font-weight: $font-weight-semi-bold !default;
 
-$code-color: #E83E8C !default;
\ No newline at end of file
+$code-color: #e83e8c !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_utilities.scss b/packages/clay-css/src/scss/atlas/variables/_utilities.scss
index 059b8ce7e9..4c0dfbc559 100644
--- a/packages/clay-css/src/scss/atlas/variables/_utilities.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_utilities.scss
@@ -3,26 +3,32 @@ $bg-checkered-fg: $gray-300 !default;
 // C Focus Inset
 
 $c-focus-inset-focus: () !default;
-$c-focus-inset-focus: map-deep-merge((
-	box-shadow: $component-focus-inset-box-shadow,
-	border-color: $primary-l1,
-	outline: 0,
-), $c-focus-inset-focus);
+$c-focus-inset-focus: map-deep-merge(
+	(
+		box-shadow: $component-focus-inset-box-shadow,
+		border-color: $primary-l1,
+		outline: 0,
+	),
+	$c-focus-inset-focus
+);
 
 // Close
 
 $close: () !default;
-$close: map-deep-merge((
-	color: $gray-900,
-	opacity: 1,
-	hover-color: $gray-900,
-	hover-opacity: 1,
-	focus-box-shadow: $btn-focus-box-shadow,
-	focus-opacity: 1,
-	focus-outline: 0,
-	disabled-color: $gray-600,
-	disabled-opacity: $btn-disabled-opacity,
-	btn-focus-box-shadow: $btn-focus-box-shadow,
-), $close);
+$close: map-deep-merge(
+	(
+		color: $gray-900,
+		opacity: 1,
+		hover-color: $gray-900,
+		hover-opacity: 1,
+		focus-box-shadow: $btn-focus-box-shadow,
+		focus-opacity: 1,
+		focus-outline: 0,
+		disabled-color: $gray-600,
+		disabled-opacity: $btn-disabled-opacity,
+		btn-focus-box-shadow: $btn-focus-box-shadow,
+	),
+	$close
+);
 
-$page-header-bg: $white !default;
\ No newline at end of file
+$page-header-bg: $white !default;
diff --git a/packages/clay-css/src/scss/base-variables.scss b/packages/clay-css/src/scss/base-variables.scss
index 187955de80..2a868e6c3d 100644
--- a/packages/clay-css/src/scss/base-variables.scss
+++ b/packages/clay-css/src/scss/base-variables.scss
@@ -1,14 +1,14 @@
 // INSERT CUSTOM BASE VARS
 
-@import "functions/_global-functions";
+@import 'functions/_global-functions';
 
-@import "variables/_bs4-variable-overwrites";
+@import 'variables/_bs4-variable-overwrites';
 
-@import "bootstrap/_functions";
-@import "bootstrap/_variables";
-@import "bootstrap/_mixins";
+@import 'bootstrap/_functions';
+@import 'bootstrap/_variables';
+@import 'bootstrap/_mixins';
 
-@import "_variables";
-@import "_mixins";
+@import '_variables';
+@import '_mixins';
 
-// INSERT CUSTOM VARS
\ No newline at end of file
+// INSERT CUSTOM VARS
diff --git a/packages/clay-css/src/scss/base.scss b/packages/clay-css/src/scss/base.scss
index 9229f563ac..8138d3fd25 100644
--- a/packages/clay-css/src/scss/base.scss
+++ b/packages/clay-css/src/scss/base.scss
@@ -1,15 +1,15 @@
 // INSERT CUSTOM VARS
 
-@import "functions/_global-functions";
+@import 'functions/_global-functions';
 
-@import "variables/_bs4-variable-overwrites";
+@import 'variables/_bs4-variable-overwrites';
 
-@import "bootstrap/bootstrap";
+@import 'bootstrap/bootstrap';
 
-@import "_variables";
+@import '_variables';
 
-@import "_mixins";
+@import '_mixins';
 
-@import "_components";
+@import '_components';
 
-// INSERT CUSTOM EXTENSIONS
\ No newline at end of file
+// INSERT CUSTOM EXTENSIONS
diff --git a/packages/clay-css/src/scss/bootstrap.scss b/packages/clay-css/src/scss/bootstrap.scss
index 87b192fa7a..47b9dc3c0c 100644
--- a/packages/clay-css/src/scss/bootstrap.scss
+++ b/packages/clay-css/src/scss/bootstrap.scss
@@ -1,5 +1,5 @@
 // INSERT CUSTOM VARS
 
-@import "bootstrap/bootstrap";
+@import 'bootstrap/bootstrap';
 
-// INSERT CUSTOM EXTENSIONS
\ No newline at end of file
+// INSERT CUSTOM EXTENSIONS
diff --git a/packages/clay-css/src/scss/components/_alerts.scss b/packages/clay-css/src/scss/components/_alerts.scss
index cf1c71d363..3cd752b673 100644
--- a/packages/clay-css/src/scss/components/_alerts.scss
+++ b/packages/clay-css/src/scss/components/_alerts.scss
@@ -82,7 +82,9 @@
 		.container-fluid {
 			padding-bottom: $alert-dismissible-padding-bottom;
 			padding-left: $alert-dismissible-padding-left;
-			padding-right: calc(#{$alert-dismissible-padding-right} + #{$grid-gutter-width / 2});
+			padding-right: calc(
+				#{$alert-dismissible-padding-right} + #{$grid-gutter-width / 2}
+			);
 			padding-top: $alert-dismissible-padding-top;
 			position: relative;
 		}
@@ -225,4 +227,4 @@
 			color: map-get($value, lead-color);
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_application-bar.scss b/packages/clay-css/src/scss/components/_application-bar.scss
index 1dc6656551..018b402391 100644
--- a/packages/clay-css/src/scss/components/_application-bar.scss
+++ b/packages/clay-css/src/scss/components/_application-bar.scss
@@ -16,4 +16,4 @@
 
 .application-bar-dark {
 	@include clay-navbar-variant($application-bar-dark);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_aspect-ratio.scss b/packages/clay-css/src/scss/components/_aspect-ratio.scss
index 166331e489..7744ac8d53 100644
--- a/packages/clay-css/src/scss/components/_aspect-ratio.scss
+++ b/packages/clay-css/src/scss/components/_aspect-ratio.scss
@@ -231,4 +231,4 @@
 
 .aspect-ratio-bg-center {
 	@extend %aspect-ratio-bg-center;
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_badges.scss b/packages/clay-css/src/scss/components/_badges.scss
index 459d336f5b..41d42beda0 100644
--- a/packages/clay-css/src/scss/components/_badges.scss
+++ b/packages/clay-css/src/scss/components/_badges.scss
@@ -149,4 +149,4 @@
 			}
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_breadcrumbs.scss b/packages/clay-css/src/scss/components/_breadcrumbs.scss
index 961e079aed..9c24f5a934 100644
--- a/packages/clay-css/src/scss/components/_breadcrumbs.scss
+++ b/packages/clay-css/src/scss/components/_breadcrumbs.scss
@@ -49,8 +49,7 @@
 				position: absolute;
 				top: 50%;
 				width: $breadcrumb-divider-svg-icon-width;
-			}
-			@else {
+			} @else {
 				font-family: $breadcrumb-divider-font-family;
 				font-weight: $breadcrumb-divider-font-weight;
 				padding-left: 0.4em;
@@ -80,4 +79,4 @@
 	@include clay-scale-component {
 		max-width: $breadcrumb-text-truncate-max-width-mobile;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_buttons.scss b/packages/clay-css/src/scss/components/_buttons.scss
index c0afcfffd8..b8d191fb74 100644
--- a/packages/clay-css/src/scss/components/_buttons.scss
+++ b/packages/clay-css/src/scss/components/_buttons.scss
@@ -230,7 +230,9 @@
 		margin: #{math-sign($btn-padding-y)} #{math-sign($btn-padding-x)};
 
 		@include clay-scale-component {
-			margin: #{math-sign($btn-padding-y-mobile)} #{math-sign($btn-padding-x-mobile)};
+			margin: #{math-sign($btn-padding-y-mobile)} #{math-sign(
+					$btn-padding-x-mobile
+				)};
 		}
 	}
 
@@ -252,10 +254,13 @@
 
 	.btn-sm {
 		.c-inner {
-			margin: #{math-sign($btn-padding-y-sm)} #{math-sign($btn-padding-x-sm)};
+			margin: #{math-sign($btn-padding-y-sm)}
+				#{math-sign($btn-padding-x-sm)};
 
 			@include clay-scale-component {
-				margin: #{math-sign($btn-padding-y-sm-mobile)} #{math-sign($btn-padding-x-sm-mobile)};
+				margin: #{math-sign($btn-padding-y-sm-mobile)} #{math-sign(
+						$btn-padding-x-sm-mobile
+					)};
 			}
 		}
 
@@ -267,10 +272,13 @@
 
 	.btn-lg {
 		.c-inner {
-			margin: #{math-sign($btn-padding-y-lg)} #{math-sign($btn-padding-x-lg)};
+			margin: #{math-sign($btn-padding-y-lg)}
+				#{math-sign($btn-padding-x-lg)};
 
 			@include clay-scale-component {
-				margin: #{math-sign($btn-padding-y-lg-mobile)} #{math-sign($btn-padding-x-lg-mobile)};
+				margin: #{math-sign($btn-padding-y-lg-mobile)} #{math-sign(
+						$btn-padding-x-lg-mobile
+					)};
 			}
 		}
 
@@ -338,4 +346,4 @@
 .btn .loading-animation {
 	font-size: 1em;
 	margin-top: $inline-item-lexicon-icon-margin-top;
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_cards.scss b/packages/clay-css/src/scss/components/_cards.scss
index e6603d8574..f187fdf13d 100644
--- a/packages/clay-css/src/scss/components/_cards.scss
+++ b/packages/clay-css/src/scss/components/_cards.scss
@@ -179,7 +179,9 @@
 }
 
 .autofit-col:first-child .card-item-first {
-	@include border-radius($card-inner-border-radius 0 0 $card-inner-border-radius);
+	@include border-radius(
+		$card-inner-border-radius 0 0 $card-inner-border-radius
+	);
 }
 
 .card-item-last {
@@ -189,7 +191,9 @@
 }
 
 .autofit-col:last-child .card-item-last {
-	@include border-radius(0 $card-inner-border-radius $card-inner-border-radius 0);
+	@include border-radius(
+		0 $card-inner-border-radius $card-inner-border-radius 0
+	);
 }
 
 .rounded {
@@ -210,16 +214,18 @@
 		border-top-left-radius: $card-rounded-inner-border-radius;
 
 		.card-item-first {
-			border-radius: $card-rounded-inner-border-radius 0 0 $card-rounded-inner-border-radius;
+			border-radius: $card-rounded-inner-border-radius 0 0
+				$card-rounded-inner-border-radius;
 		}
 	}
 
-	.autofit-col:last-child{
+	.autofit-col:last-child {
 		border-bottom-right-radius: $card-rounded-inner-border-radius;
 		border-top-right-radius: $card-rounded-inner-border-radius;
 
 		.card-item-last {
-			border-radius: 0 $card-rounded-inner-border-radius $card-rounded-inner-border-radius 0;
+			border-radius: 0 $card-rounded-inner-border-radius
+				$card-rounded-inner-border-radius 0;
 		}
 	}
 }
@@ -242,7 +248,8 @@
 		border-top-left-radius: $card-rounded-0-inner-border-radius;
 
 		.card-item-first {
-			border-radius: $card-rounded-0-inner-border-radius 0 0 $card-rounded-0-inner-border-radius;
+			border-radius: $card-rounded-0-inner-border-radius 0 0
+				$card-rounded-0-inner-border-radius;
 		}
 	}
 
@@ -251,7 +258,8 @@
 		border-top-right-radius: $card-rounded-0-inner-border-radius;
 
 		.card-item-last {
-			border-radius: 0 $card-rounded-0-inner-border-radius $card-rounded-0-inner-border-radius 0;
+			border-radius: 0 $card-rounded-0-inner-border-radius
+				$card-rounded-0-inner-border-radius 0;
 		}
 	}
 }
@@ -274,7 +282,8 @@
 		border-top-left-radius: $card-rounded-circle-inner-border-radius;
 
 		.card-item-first {
-			border-radius: $card-rounded-circle-inner-border-radius 0 0 $card-rounded-circle-inner-border-radius;
+			border-radius: $card-rounded-circle-inner-border-radius 0 0
+				$card-rounded-circle-inner-border-radius;
 		}
 	}
 
@@ -283,7 +292,8 @@
 		border-top-right-radius: $card-rounded-circle-inner-border-radius;
 
 		.card-item-last {
-			border-radius: 0 $card-rounded-circle-inner-border-radius $card-rounded-circle-inner-border-radius 0;
+			border-radius: 0 $card-rounded-circle-inner-border-radius
+				$card-rounded-circle-inner-border-radius 0;
 		}
 	}
 }
@@ -555,4 +565,4 @@
 
 .template-card-horizontal {
 	@include clay-card-variant($template-card-horizontal);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_clay-color.scss b/packages/clay-css/src/scss/components/_clay-color.scss
index edcdd55a9d..c35f704c7c 100644
--- a/packages/clay-css/src/scss/components/_clay-color.scss
+++ b/packages/clay-css/src/scss/components/_clay-color.scss
@@ -26,7 +26,9 @@
 	}
 
 	.component-action {
-		@include clay-button-variant($clay-color-dropdown-menu-component-action);
+		@include clay-button-variant(
+			$clay-color-dropdown-menu-component-action
+		);
 	}
 
 	.form-control {
@@ -38,7 +40,9 @@
 	}
 
 	.input-group-inset-item-before {
-		@include clay-container($clay-color-dropdown-menu-input-group-inset-item-before);
+		@include clay-container(
+			$clay-color-dropdown-menu-input-group-inset-item-before
+		);
 	}
 }
 
@@ -99,7 +103,8 @@
 }
 
 .clay-color-map-hsb {
-	background-image: linear-gradient(to top, #000, rgba(0, 0, 0, 0)), linear-gradient(to right, #FFF, rgba(255, 255, 255, 0));
+	background-image: linear-gradient(to top, #000, rgba(0, 0, 0, 0)),
+		linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
 
 	@include clay-container($clay-color-map-hsb);
 }
@@ -118,7 +123,9 @@
 	}
 
 	.input-group-inset-item-before {
-		@include clay-container($clay-color-map-values-input-group-inset-item-before);
+		@include clay-container(
+			$clay-color-map-values-input-group-inset-item-before
+		);
 	}
 
 	.form-group {
@@ -133,9 +140,18 @@
 }
 
 .clay-color-range-hue {
-	background-image: linear-gradient(270deg, #FC0D1B 0%, #FC22D6 18.23%, #1824FB 34.25%, #2BF6FD 50.28%, #2BFD2E 67.58%, #FCFD37 81.22%, #FC121B 100%);
+	background-image: linear-gradient(
+		270deg,
+		#fc0d1b 0%,
+		#fc22d6 18.23%,
+		#1824fb 34.25%,
+		#2bf6fd 50.28%,
+		#2bfd2e 67.58%,
+		#fcfd37 81.22%,
+		#fc121b 100%
+	);
 }
 
 .clay-color-range-pointer {
 	@include clay-button-variant($clay-color-range-pointer);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_custom-forms.scss b/packages/clay-css/src/scss/components/_custom-forms.scss
index c5f18976f6..54f2296546 100644
--- a/packages/clay-css/src/scss/components/_custom-forms.scss
+++ b/packages/clay-css/src/scss/components/_custom-forms.scss
@@ -47,7 +47,7 @@
 
 		+ .input-group {
 			border-radius: 1px;
-			box-shadow: 0 0 0 0.075rem #FFF, $btn-focus-box-shadow;
+			box-shadow: 0 0 0 0.075rem #fff, $btn-focus-box-shadow;
 		}
 	}
 
@@ -229,4 +229,4 @@ label.custom-control-label {
 	+ .custom-control-inline {
 		margin-left: $custom-control-spacer-x;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_date-picker.scss b/packages/clay-css/src/scss/components/_date-picker.scss
index cdd7f8ab85..695d99b44a 100644
--- a/packages/clay-css/src/scss/components/_date-picker.scss
+++ b/packages/clay-css/src/scss/components/_date-picker.scss
@@ -100,4 +100,4 @@
 
 .next-month-date {
 	@include clay-button-variant($date-picker-next-month-date);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_drilldown.scss b/packages/clay-css/src/scss/components/_drilldown.scss
index 963698f74f..1c8d029975 100644
--- a/packages/clay-css/src/scss/components/_drilldown.scss
+++ b/packages/clay-css/src/scss/components/_drilldown.scss
@@ -41,4 +41,4 @@
 
 .transitioning {
 	display: block;
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_dropdowns.scss b/packages/clay-css/src/scss/components/_dropdowns.scss
index 7fa6331214..81e8c21b4b 100644
--- a/packages/clay-css/src/scss/components/_dropdowns.scss
+++ b/packages/clay-css/src/scss/components/_dropdowns.scss
@@ -6,12 +6,12 @@
 	white-space: normal;
 	word-wrap: break-word;
 
-	@if not ($dropdown-header-padding-y == $dropdown-padding-y) {
+	@if not($dropdown-header-padding-y == $dropdown-padding-y) {
 		padding-bottom: $dropdown-header-padding-y;
 		padding-top: $dropdown-header-padding-y;
 	}
 
-	@if not ($dropdown-header-padding-x == $dropdown-item-padding-x) {
+	@if not($dropdown-header-padding-x == $dropdown-item-padding-x) {
 		padding-left: $dropdown-header-padding-x;
 		padding-right: $dropdown-header-padding-x;
 	}
@@ -229,13 +229,18 @@
 	.dropdown-subheader,
 	.dropdown-caption,
 	.dropdown-item {
-		padding-left: $dropdown-item-padding-x + $dropdown-item-indicator-size + $dropdown-item-indicator-spacer-x;
+		padding-left: $dropdown-item-padding-x + $dropdown-item-indicator-size +
+			$dropdown-item-indicator-spacer-x;
 	}
 
 	@if ($enable-c-inner) {
 		.dropdown-item {
 			.c-inner {
-				margin-left: math-sign($dropdown-item-padding-x + $dropdown-item-indicator-size + $dropdown-item-indicator-spacer-x);
+				margin-left: math-sign(
+					$dropdown-item-padding-x +
+						$dropdown-item-indicator-size +
+						$dropdown-item-indicator-spacer-x
+				);
 			}
 		}
 	}
@@ -258,11 +263,16 @@
 	}
 
 	.dropdown-item {
-		padding-right: $dropdown-item-padding-x + $dropdown-item-indicator-size + $dropdown-item-indicator-spacer-x;
+		padding-right: $dropdown-item-padding-x + $dropdown-item-indicator-size +
+			$dropdown-item-indicator-spacer-x;
 
 		@if ($enable-c-inner) {
 			.c-inner {
-				margin-right: math-sign($dropdown-item-padding-x + $dropdown-item-indicator-size + $dropdown-item-indicator-spacer-x);
+				margin-right: math-sign(
+					$dropdown-item-padding-x +
+						$dropdown-item-indicator-size +
+						$dropdown-item-indicator-spacer-x
+				);
 			}
 		}
 	}
@@ -341,7 +351,7 @@
 	margin-top: 0;
 	right: 100% !important;
 	top: 50% !important;
-	transform: translate(0 , -50%) !important;
+	transform: translate(0, -50%) !important;
 	will-change: auto !important;
 }
 
@@ -374,7 +384,7 @@
 	margin-top: 0;
 	right: auto !important;
 	top: 50% !important;
-	transform: translate(0 , -50%) !important;
+	transform: translate(0, -50%) !important;
 	will-change: auto !important;
 }
 
@@ -457,4 +467,4 @@
 .navbar-right .dropdown-menu-center {
 	left: 50%;
 	right: auto;
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_form-validation.scss b/packages/clay-css/src/scss/components/_form-validation.scss
index 4b6ebdc779..06f7c865ee 100644
--- a/packages/clay-css/src/scss/components/_form-validation.scss
+++ b/packages/clay-css/src/scss/components/_form-validation.scss
@@ -114,12 +114,21 @@
 
 	.input-group-item {
 		&.focus {
-			box-shadow: setter($input-danger-focus-box-shadow, $input-danger-box-shadow);
+			box-shadow: setter(
+				$input-danger-focus-box-shadow,
+				$input-danger-box-shadow
+			);
 
 			.form-control,
 			.input-group-inset-item {
-				background-color: setter($input-danger-focus-bg, $input-danger-bg);
-				border-color: setter($input-danger-focus-border-color, $input-danger-border-color);
+				background-color: setter(
+					$input-danger-focus-bg,
+					$input-danger-bg
+				);
+				border-color: setter(
+					$input-danger-focus-border-color,
+					$input-danger-border-color
+				);
 			}
 		}
 
@@ -127,8 +136,14 @@
 			box-shadow: none;
 
 			~ .input-group-inset-item {
-				background-color: setter($input-danger-focus-bg, $input-danger-bg);
-				border-color: setter($input-danger-focus-border-color, $input-danger-border-color);
+				background-color: setter(
+					$input-danger-focus-bg,
+					$input-danger-bg
+				);
+				border-color: setter(
+					$input-danger-focus-border-color,
+					$input-danger-border-color
+				);
 			}
 		}
 	}
@@ -186,12 +201,21 @@
 
 	.input-group-item {
 		&.focus {
-			box-shadow: setter($input-warning-focus-box-shadow, $input-warning-box-shadow);
+			box-shadow: setter(
+				$input-warning-focus-box-shadow,
+				$input-warning-box-shadow
+			);
 
 			.form-control,
 			.input-group-inset-item {
-				background-color: setter($input-warning-focus-bg, $input-warning-bg);
-				border-color: setter($input-warning-focus-border-color, $input-warning-border-color);
+				background-color: setter(
+					$input-warning-focus-bg,
+					$input-warning-bg
+				);
+				border-color: setter(
+					$input-warning-focus-border-color,
+					$input-warning-border-color
+				);
 			}
 		}
 
@@ -199,8 +223,14 @@
 			box-shadow: none;
 
 			~ .input-group-inset-item {
-				background-color: setter($input-warning-focus-bg, $input-warning-bg);
-				border-color: setter($input-warning-focus-border-color, $input-warning-border-color);
+				background-color: setter(
+					$input-warning-focus-bg,
+					$input-warning-bg
+				);
+				border-color: setter(
+					$input-warning-focus-border-color,
+					$input-warning-border-color
+				);
 			}
 		}
 	}
@@ -258,12 +288,21 @@
 
 	.input-group-item {
 		&.focus {
-			box-shadow: setter($input-success-focus-box-shadow, $input-success-box-shadow);
+			box-shadow: setter(
+				$input-success-focus-box-shadow,
+				$input-success-box-shadow
+			);
 
 			.form-control,
 			.input-group-inset-item {
-				background-color: setter($input-success-focus-bg, $input-success-bg);
-				border-color: setter($input-success-focus-border-color, $input-success-border-color);
+				background-color: setter(
+					$input-success-focus-bg,
+					$input-success-bg
+				);
+				border-color: setter(
+					$input-success-focus-border-color,
+					$input-success-border-color
+				);
 			}
 		}
 
@@ -271,8 +310,14 @@
 			box-shadow: none;
 
 			~ .input-group-inset-item {
-				background-color: setter($input-success-focus-bg, $input-success-bg);
-				border-color: setter($input-success-focus-border-color, $input-success-border-color);
+				background-color: setter(
+					$input-success-focus-bg,
+					$input-success-bg
+				);
+				border-color: setter(
+					$input-success-focus-border-color,
+					$input-success-border-color
+				);
 			}
 		}
 	}
@@ -282,4 +327,4 @@
 		border-color: $input-success-border-color;
 		box-shadow: $input-success-box-shadow;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_forms.scss b/packages/clay-css/src/scss/components/_forms.scss
index 116adec3f0..7565350036 100644
--- a/packages/clay-css/src/scss/components/_forms.scss
+++ b/packages/clay-css/src/scss/components/_forms.scss
@@ -1,4 +1,4 @@
-[type="checkbox"] {
+[type='checkbox'] {
 	cursor: $form-check-input-cursor;
 	height: 14px;
 	width: 14px;
@@ -8,7 +8,7 @@
 	}
 }
 
-[type="radio"] {
+[type='radio'] {
 	cursor: $form-check-input-cursor;
 	height: 15px;
 	width: 14px;
@@ -88,19 +88,19 @@ label {
 	border-right-width: $input-border-right-width;
 	border-top-width: $input-border-top-width;
 
-	@if not ($input-font-size == $font-size-base) {
+	@if not($input-font-size == $font-size-base) {
 		font-size: $input-font-size;
 	}
 
 	height: $input-height;
 	min-width: 0;
 
-	@if not ($input-padding-y == $btn-padding-y) {
+	@if not($input-padding-y == $btn-padding-y) {
 		padding-bottom: $input-padding-y;
 		padding-top: $input-padding-y;
 	}
 
-	@if not ($input-padding-x == $btn-padding-x) {
+	@if not($input-padding-x == $btn-padding-x) {
 		padding-left: $input-padding-x;
 		padding-right: $input-padding-x;
 	}
@@ -128,7 +128,7 @@ label {
 		opacity: $input-disabled-opacity;
 	}
 
-	&[type="range"] {
+	&[type='range'] {
 		background-color: transparent;
 		border-color: transparent;
 		padding: 0;
@@ -144,7 +144,7 @@ label {
 		}
 	}
 
-	&:not([type="range"]) {
+	&:not([type='range']) {
 		@media screen and (-webkit-min-device-pixel-ratio: 0) {
 			-webkit-appearance: none;
 		}
@@ -169,14 +169,14 @@ label {
 	border-right-width: $input-border-right-width;
 	border-top-width: $input-border-top-width;
 
-	@if not ($input-font-size == $font-size-base) {
+	@if not($input-font-size == $font-size-base) {
 		font-size: $input-font-size;
 	}
 
 	height: $input-height;
 	min-width: 0;
 
-	@if not ($input-padding-y == $btn-padding-y) {
+	@if not($input-padding-y == $btn-padding-y) {
 		padding-bottom: $input-padding-y;
 		padding-top: $input-padding-y;
 	}
@@ -364,7 +364,7 @@ fieldset[disabled] label {
 }
 
 .form-check.disabled .form-check-label {
-	@if not ($input-label-disabled-color == $text-muted) {
+	@if not($input-label-disabled-color == $text-muted) {
 		color: $input-label-disabled-color;
 	}
 }
@@ -411,7 +411,6 @@ fieldset[disabled] label {
 }
 
 %clay-select-form-control-lg {
-
 	height: $input-height-lg;
 
 	@include clay-scale-component {
@@ -608,4 +607,4 @@ textarea.form-control-sm,
 			margin-top: $form-group-sm-item-label-spacer;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_grid.scss b/packages/clay-css/src/scss/components/_grid.scss
index be78d738d3..9710ecca02 100644
--- a/packages/clay-css/src/scss/components/_grid.scss
+++ b/packages/clay-css/src/scss/components/_grid.scss
@@ -18,7 +18,7 @@
 
 			// .container-no-gutters-sm-down, md-down, lg-down, xl-down
 
-			@if not ($infix == '') {
+			@if not($infix == '') {
 				&#{$infix}-down {
 					@include media-breakpoint-down($breakpoint) {
 						@include clay-container-no-gutters;
@@ -46,7 +46,9 @@
 		@include clay-container($container-form-lg);
 
 		.menubar-vertical-expand-lg {
-			$container-form-lg-breakpoint-down: clay-breakpoint-prev(map-get($container-form-lg, breakpoint-up));
+			$container-form-lg-breakpoint-down: clay-breakpoint-prev(
+				map-get($container-form-lg, breakpoint-up)
+			);
 
 			@include media-breakpoint-down($container-form-lg-breakpoint-down) {
 				margin-top: -(map-get($container-form-lg, padding-top-mobile));
@@ -57,4 +59,4 @@
 	.container-view {
 		@include clay-container($container-view);
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_icons.scss b/packages/clay-css/src/scss/components/_icons.scss
index a6c93d1361..c8cd539a6a 100644
--- a/packages/clay-css/src/scss/components/_icons.scss
+++ b/packages/clay-css/src/scss/components/_icons.scss
@@ -97,4 +97,4 @@ button.collapse-icon {
 		-ms-transform: translateY(-50%);
 		transform: translateY(-50%);
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_input-groups.scss b/packages/clay-css/src/scss/components/_input-groups.scss
index be3b848720..4f921387f5 100644
--- a/packages/clay-css/src/scss/components/_input-groups.scss
+++ b/packages/clay-css/src/scss/components/_input-groups.scss
@@ -99,13 +99,19 @@
 
 .input-group > .input-group-prepend > .form-file .btn,
 .input-group > .input-group-append:not(:last-child) > .form-file .btn,
-.input-group > .input-group-append:last-child > .form-file:not(:last-child) .btn {
+.input-group
+	> .input-group-append:last-child
+	> .form-file:not(:last-child)
+	.btn {
 	@include border-right-radius(0);
 }
 
 .input-group > .input-group-append > .form-file .btn,
 .input-group > .input-group-prepend:not(:first-child) > .form-file .btn,
-.input-group > .input-group-prepend:first-child > .form-file:not(:first-child) .btn {
+.input-group
+	> .input-group-prepend:first-child
+	> .form-file:not(:first-child)
+	.btn {
 	@include border-left-radius(0);
 }
 
@@ -369,7 +375,9 @@
 			height: 75%;
 
 			.btn {
-				@include clay-button-size($input-group-lg-inset-item-form-file-btn);
+				@include clay-button-size(
+					$input-group-lg-inset-item-form-file-btn
+				);
 			}
 		}
 	}
@@ -436,7 +444,9 @@
 			height: 75%;
 
 			.btn {
-				@include clay-button-size($input-group-sm-inset-item-form-file-btn);
+				@include clay-button-size(
+					$input-group-sm-inset-item-form-file-btn
+				);
 			}
 		}
 	}
@@ -449,13 +459,13 @@
 // Input Group Password
 
 .input-group-password {
-	.form-control[type="text"] ~ .input-group-inset-item {
+	.form-control[type='text'] ~ .input-group-inset-item {
 		.input-password-label {
 			display: none;
 		}
 	}
 
-	.form-control[type="password"] ~ .input-group-inset-item {
+	.form-control[type='password'] ~ .input-group-inset-item {
 		.input-text-label {
 			display: none;
 		}
@@ -468,4 +478,4 @@
 	.input-group {
 		@extend %clay-input-group-sm;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_labels.scss b/packages/clay-css/src/scss/components/_labels.scss
index 40091eeca8..7ef6a60825 100644
--- a/packages/clay-css/src/scss/components/_labels.scss
+++ b/packages/clay-css/src/scss/components/_labels.scss
@@ -182,4 +182,4 @@ button.label {
 	.label-#{$color} {
 		@include clay-label-variant(map-get($label-palette, $color));
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_links.scss b/packages/clay-css/src/scss/components/_links.scss
index 1437eb430a..9b0f5eeba8 100644
--- a/packages/clay-css/src/scss/components/_links.scss
+++ b/packages/clay-css/src/scss/components/_links.scss
@@ -64,4 +64,4 @@ button.link-outline {
 
 .component-action {
 	@include clay-link($component-action);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_list-group.scss b/packages/clay-css/src/scss/components/_list-group.scss
index 42b7e2e754..416ba443e6 100644
--- a/packages/clay-css/src/scss/components/_list-group.scss
+++ b/packages/clay-css/src/scss/components/_list-group.scss
@@ -217,9 +217,10 @@
 }
 
 .list-group-item-action {
-	@if ($enable-c-inner){
+	@if ($enable-c-inner) {
 		.c-inner {
-			margin: #{math-sign($list-group-item-padding-y)} #{math-sign($list-group-item-padding-x)};
+			margin: #{math-sign($list-group-item-padding-y)}
+				#{math-sign($list-group-item-padding-x)};
 			width: auto;
 		}
 	}
@@ -353,7 +354,9 @@
 	.list-group-item {
 		border-width: 0;
 
-		@include clay-list-group-notification-item-variant($list-group-notification-item);
+		@include clay-list-group-notification-item-variant(
+			$list-group-notification-item
+		);
 	}
 
 	.list-group-item-flex {
@@ -363,16 +366,21 @@
 	}
 
 	.list-group-item-primary {
-		@include clay-list-group-notification-item-variant($list-group-notification-item-primary);
+		@include clay-list-group-notification-item-variant(
+			$list-group-notification-item-primary
+		);
 	}
 
 	.quick-action-menu {
-		margin-bottom: -$list-group-item-padding-y + $list-group-notification-item-border-bottom-width;
-		margin-top: -$list-group-item-padding-y + $list-group-notification-item-border-top-width;
+		margin-bottom: -$list-group-item-padding-y +
+			$list-group-notification-item-border-bottom-width;
+		margin-top: -$list-group-item-padding-y +
+			$list-group-notification-item-border-top-width;
 	}
 
 	.autofit-col .quick-action-item {
-		margin-top: $list-group-notification-item-border-top-width - $list-group-item-flex-offset-top;
+		margin-top: $list-group-notification-item-border-top-width -
+			$list-group-item-flex-offset-top;
 	}
 }
 
@@ -386,4 +394,4 @@
 	.quick-action-menu {
 		@include clay-container($list-group-sm-quick-action-menu);
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_loaders.scss b/packages/clay-css/src/scss/components/_loaders.scss
index 29b36e66f4..b29cc37094 100644
--- a/packages/clay-css/src/scss/components/_loaders.scss
+++ b/packages/clay-css/src/scss/components/_loaders.scss
@@ -32,4 +32,4 @@
 
 .loading-animation.loading-animation-sm {
 	font-size: $loading-icon-font-size-sm;
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_management-bar.scss b/packages/clay-css/src/scss/components/_management-bar.scss
index 6f7a12d527..8beaac2d57 100644
--- a/packages/clay-css/src/scss/components/_management-bar.scss
+++ b/packages/clay-css/src/scss/components/_management-bar.scss
@@ -16,4 +16,4 @@
 
 .management-bar-primary {
 	@include clay-navbar-variant($management-bar-primary);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_menubar.scss b/packages/clay-css/src/scss/components/_menubar.scss
index 9504adb4ab..a4c810ebc3 100644
--- a/packages/clay-css/src/scss/components/_menubar.scss
+++ b/packages/clay-css/src/scss/components/_menubar.scss
@@ -14,7 +14,9 @@
 	@include clay-menubar-vertical-expand($menubar-vertical-expand-md);
 
 	&.menubar-transparent {
-		@include clay-menubar-vertical-variant($menubar-vertical-transparent-md);
+		@include clay-menubar-vertical-variant(
+			$menubar-vertical-transparent-md
+		);
 	}
 
 	&.menubar-decorated {
@@ -23,7 +25,9 @@
 				@include clay-css($menubar-vertical-decorated-md-nav);
 
 				> .nav-item .nav {
-					@include clay-css($menubar-vertical-decorated-md-nav-item-nav);
+					@include clay-css(
+						$menubar-vertical-decorated-md-nav-item-nav
+					);
 				}
 			}
 
@@ -31,7 +35,9 @@
 				@include clay-css($menubar-vertical-decorated-md-nav-link);
 
 				&.active::after {
-					@include clay-css($menubar-vertical-decorated-md-nav-link-after-active);
+					@include clay-css(
+						$menubar-vertical-decorated-md-nav-link-after-active
+					);
 				}
 			}
 		}
@@ -44,7 +50,9 @@
 	@include clay-menubar-vertical-expand($menubar-vertical-expand-lg);
 
 	&.menubar-transparent {
-		@include clay-menubar-vertical-variant($menubar-vertical-transparent-lg);
+		@include clay-menubar-vertical-variant(
+			$menubar-vertical-transparent-lg
+		);
 	}
 
 	&.menubar-decorated {
@@ -53,7 +61,9 @@
 				@include clay-css($menubar-vertical-decorated-lg-nav);
 
 				> .nav-item .nav {
-					@include clay-css($menubar-vertical-decorated-lg-nav-item-nav);
+					@include clay-css(
+						$menubar-vertical-decorated-lg-nav-item-nav
+					);
 				}
 			}
 
@@ -61,7 +71,9 @@
 				@include clay-css($menubar-vertical-decorated-lg-nav-link);
 
 				&.active::after {
-					@include clay-css($menubar-vertical-decorated-lg-nav-link-after-active);
+					@include clay-css(
+						$menubar-vertical-decorated-lg-nav-link-after-active
+					);
 				}
 			}
 		}
diff --git a/packages/clay-css/src/scss/components/_modals.scss b/packages/clay-css/src/scss/components/_modals.scss
index 1be6183f4d..eff702872d 100644
--- a/packages/clay-css/src/scss/components/_modals.scss
+++ b/packages/clay-css/src/scss/components/_modals.scss
@@ -320,4 +320,4 @@
 	.modal-#{$color} {
 		@include clay-modal-variant($value);
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_multi-step-nav.scss b/packages/clay-css/src/scss/components/_multi-step-nav.scss
index 68eeae2124..51bd77c70d 100644
--- a/packages/clay-css/src/scss/components/_multi-step-nav.scss
+++ b/packages/clay-css/src/scss/components/_multi-step-nav.scss
@@ -10,7 +10,8 @@
 
 .multi-step-indicator-label-bottom {
 	.multi-step-item {
-		padding-bottom: $multi-step-indicator-label-font-size * $line-height-base;
+		padding-bottom: $multi-step-indicator-label-font-size *
+			$line-height-base;
 	}
 
 	.multi-step-indicator-label {
@@ -78,7 +79,8 @@
 
 	&.complete {
 		.dropdown .multi-step-icon {
-			&, &:active {
+			&,
+			&:active {
 				background-image: none;
 			}
 		}
@@ -335,7 +337,9 @@
 		.multi-step-item {
 			margin-bottom: 0;
 			min-width: $multi-step-icon-size;
-			padding-top: $multi-step-title-font-size + $multi-step-title-margin-bottom + ($multi-step-divider-height / 2);
+			padding-top: $multi-step-title-font-size +
+				$multi-step-title-margin-bottom +
+				($multi-step-divider-height / 2);
 		}
 
 		.multi-step-title {
@@ -346,4 +350,4 @@
 			display: none;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_navbar.scss b/packages/clay-css/src/scss/components/_navbar.scss
index d55e1142aa..66df7fe03c 100644
--- a/packages/clay-css/src/scss/components/_navbar.scss
+++ b/packages/clay-css/src/scss/components/_navbar.scss
@@ -232,7 +232,7 @@
 
 			// .navbar-expand-sm, md, lg, xl
 
-			@if not ($infix == '') {
+			@if not($infix == '') {
 				@include media-breakpoint-down($breakpoint) {
 					&.navbar-collapse-absolute {
 						.navbar-collapse {
@@ -277,7 +277,9 @@
 
 						.navbar-nav {
 							.dropdown-toggle .navbar-text-truncate {
-								max-width: calc(100% - #{$navbar-text-truncate-spacer-right});
+								max-width: calc(
+									100% - #{$navbar-text-truncate-spacer-right}
+								);
 							}
 
 							.dropdown-divider {
@@ -313,7 +315,8 @@
 					.show-dropdown-on-collapse {
 						.dropdown-header,
 						.dropdown-item {
-							padding: $nav-link-padding-y $navbar-nav-link-padding-x;
+							padding: $nav-link-padding-y
+								$navbar-nav-link-padding-x;
 						}
 
 						.dropdown-menu {
@@ -346,7 +349,7 @@
 			// .navbar-expand-sm, md, lg, xl
 
 			@include media-breakpoint-up($next) {
-				@if not ($infix == '') {
+				@if not($infix == '') {
 					.navbar-brand .navbar-text-truncate {
 						max-width: $navbar-text-truncate-max-width;
 					}
@@ -362,7 +365,8 @@
 						}
 
 						.dropdown-toggle .navbar-text-truncate {
-							max-width: $navbar-text-truncate-max-width - $navbar-text-truncate-spacer-right;
+							max-width: $navbar-text-truncate-max-width -
+								$navbar-text-truncate-spacer-right;
 						}
 					}
 
@@ -469,4 +473,4 @@
 			}
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_navigation-bar.scss b/packages/clay-css/src/scss/components/_navigation-bar.scss
index 2ef5ab3192..83f2480dec 100644
--- a/packages/clay-css/src/scss/components/_navigation-bar.scss
+++ b/packages/clay-css/src/scss/components/_navigation-bar.scss
@@ -9,4 +9,4 @@
 
 .navigation-bar-secondary {
 	@include clay-navbar-variant($navigation-bar-secondary);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_navs.scss b/packages/clay-css/src/scss/components/_navs.scss
index ec409d7004..2bb92cc5f0 100644
--- a/packages/clay-css/src/scss/components/_navs.scss
+++ b/packages/clay-css/src/scss/components/_navs.scss
@@ -161,7 +161,7 @@
 	}
 }
 
-.dropdown-item[data-toggle="tab"] {
+.dropdown-item[data-toggle='tab'] {
 	.dropdown-item-indicator,
 	.dropdown-item-indicator-start,
 	.dropdown-item-indicator-end {
@@ -184,7 +184,10 @@
 
 	.nav-underline .nav-item:nth-of-type(#{$index}n + 0) {
 		.nav-link::after {
-			background-color: nth($nav-underline-link-highlight-palette, $index);
+			background-color: nth(
+				$nav-underline-link-highlight-palette,
+				$index
+			);
 		}
 	}
 }
@@ -219,11 +222,19 @@
 	.nav-link.active,
 	.nav-item.show .nav-link {
 		&:after {
-			@if not ($nav-underline-link-active-content == $nav-underline-link-highlight-content) {
+			@if not(
+				$nav-underline-link-active-content ==
+					$nav-underline-link-highlight-content
+			)
+			{
 				content: $nav-underline-link-active-content;
 			}
 
-			@if not ($nav-underline-link-active-highlight-height == $nav-underline-link-highlight-height) {
+			@if not(
+				$nav-underline-link-active-highlight-height ==
+					$nav-underline-link-highlight-height
+			)
+			{
 				height: $nav-underline-link-active-highlight-height;
 			}
 		}
@@ -232,4 +243,4 @@
 	.nav-item .nav-link.disabled:after {
 		background-color: $nav-underline-link-disabled-highlight;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_pagination.scss b/packages/clay-css/src/scss/components/_pagination.scss
index 019e8a2d10..803c83fc34 100644
--- a/packages/clay-css/src/scss/components/_pagination.scss
+++ b/packages/clay-css/src/scss/components/_pagination.scss
@@ -166,7 +166,8 @@
 
 		@if ($enable-c-inner) {
 			.c-inner {
-				margin: #{math-sign($pagination-padding-y-sm)} #{math-sign($pagination-padding-x)};
+				margin: #{math-sign($pagination-padding-y-sm)}
+					#{math-sign($pagination-padding-x)};
 			}
 		}
 	}
@@ -184,7 +185,8 @@
 
 		@if ($enable-c-inner) {
 			.c-inner {
-				margin: #{math-sign($pagination-padding-y-sm)} #{math-sign($pagination-padding-x-sm)};
+				margin: #{math-sign($pagination-padding-y-sm)}
+					#{math-sign($pagination-padding-x-sm)};
 			}
 		}
 
@@ -213,7 +215,8 @@
 
 		@if ($enable-c-inner) {
 			.c-inner {
-				margin: #{math-sign($pagination-padding-y-lg)} #{math-sign($pagination-padding-x)};
+				margin: #{math-sign($pagination-padding-y-lg)}
+					#{math-sign($pagination-padding-x)};
 			}
 		}
 	}
@@ -231,7 +234,8 @@
 
 		@if ($enable-c-inner) {
 			.c-inner {
-				margin: #{math-sign($pagination-padding-y-lg)} #{math-sign($pagination-padding-x-lg)};
+				margin: #{math-sign($pagination-padding-y-lg)}
+					#{math-sign($pagination-padding-x-lg)};
 			}
 		}
 
@@ -239,4 +243,4 @@
 			padding: $pagination-padding-y-lg $pagination-padding-x-lg;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_panels.scss b/packages/clay-css/src/scss/components/_panels.scss
index 565cb48b6b..c9fe3e1e5d 100644
--- a/packages/clay-css/src/scss/components/_panels.scss
+++ b/packages/clay-css/src/scss/components/_panels.scss
@@ -13,7 +13,7 @@
 .panel-header {
 	border-bottom: $panel-header-border-bottom-width solid transparent;
 
-	@if not ($panel-header-offset-border-radius == 0) {
+	@if not($panel-header-offset-border-radius == 0) {
 		@include border-top-radius($panel-header-offset-border-radius);
 	}
 
@@ -26,13 +26,14 @@
 
 	@if ($enable-c-inner) {
 		.c-inner {
-			margin: #{math-sign($panel-header-padding-y)} #{math-sign($panel-header-padding-x)};
+			margin: #{math-sign($panel-header-padding-y)}
+				#{math-sign($panel-header-padding-x)};
 			width: auto;
 		}
 	}
 
 	&.collapsed {
-		@if not ($panel-header-offset-border-radius == 0) {
+		@if not($panel-header-offset-border-radius == 0) {
 			@include border-bottom-radius($panel-header-offset-border-radius);
 		}
 	}
@@ -43,8 +44,12 @@
 
 		@if ($enable-c-inner) {
 			.c-inner {
-				margin-left: #{math-sign($panel-header-collapse-icon-padding-left)};
-				margin-right: #{math-sign($panel-header-collapse-icon-padding-right)};
+				margin-left: #{math-sign(
+						$panel-header-collapse-icon-padding-left
+					)};
+				margin-right: #{math-sign(
+						$panel-header-collapse-icon-padding-right
+					)};
 			}
 		}
 	}
@@ -77,7 +82,7 @@
 }
 
 .panel-footer {
-	@if not ($panel-footer-offset-border-radius == 0) {
+	@if not($panel-footer-offset-border-radius == 0) {
 		@include border-bottom-radius($panel-footer-offset-border-radius);
 	}
 
@@ -126,8 +131,10 @@
 			@include border-bottom-radius($panel-border-radius);
 
 			.panel-header.collapsed {
-				@if not ($panel-header-offset-border-radius == 0) {
-					@include border-bottom-radius($panel-header-offset-border-radius);
+				@if not($panel-header-offset-border-radius == 0) {
+					@include border-bottom-radius(
+						$panel-header-offset-border-radius
+					);
 				}
 			}
 		}
@@ -162,7 +169,8 @@
 			}
 
 			.panel-header {
-				&, &.collapsed {
+				&,
+				&.collapsed {
 					border-radius: 0;
 				}
 			}
@@ -275,8 +283,12 @@
 
 		@if ($enable-c-inner) {
 			.c-inner {
-				margin-left: #{math-sign($panel-group-flush-collapse-icon-padding-left)};
-				margin-right: #{math-sign($panel-group-flush-collapse-icon-padding-right)};
+				margin-left: #{math-sign(
+						$panel-group-flush-collapse-icon-padding-left
+					)};
+				margin-right: #{math-sign(
+						$panel-group-flush-collapse-icon-padding-right
+					)};
 			}
 		}
 	}
@@ -306,4 +318,4 @@
 
 .panel-unstyled {
 	@include clay-panel-variant($panel-unstyled);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_popovers.scss b/packages/clay-css/src/scss/components/_popovers.scss
index c4e43d15bf..eb0b1160b0 100644
--- a/packages/clay-css/src/scss/components/_popovers.scss
+++ b/packages/clay-css/src/scss/components/_popovers.scss
@@ -23,11 +23,15 @@
 .popover-header {
 	border-color: $popover-header-border-color;
 
-	@if not ($popover-offset-border-width == calc(#{$border-radius-lg} - #{$popover-border-width})) {
+	@if not(
+		$popover-offset-border-width ==
+			calc(#{$border-radius-lg} - #{$popover-border-width})
+	)
+	{
 		@include border-top-radius($popover-offset-border-width);
 	}
 
-	@if not ($popover-header-font-size == $font-size-base) {
+	@if not($popover-header-font-size == $font-size-base) {
 		font-size: $popover-header-font-size;
 	}
 
@@ -51,7 +55,9 @@
 	margin-bottom: $popover-arrow-height;
 
 	.arrow {
-		bottom: calc((#{$popover-arrow-height} + #{$popover-border-width}) * -1);
+		bottom: calc(
+			(#{$popover-arrow-height} + #{$popover-border-width}) * -1
+		);
 		margin: 0;
 
 		&::after {
@@ -95,13 +101,15 @@
 
 		&::after {
 			border-right-color: $popover-arrow-color;
-			border-width: ($popover-arrow-width / 2) $popover-arrow-height ($popover-arrow-width / 2) 0;
+			border-width: ($popover-arrow-width / 2) $popover-arrow-height
+				($popover-arrow-width / 2) 0;
 			left: $popover-border-width;
 		}
 
 		&::before {
 			border-right-color: $popover-arrow-outer-color;
-			border-width: ($popover-arrow-width / 2) $popover-arrow-height ($popover-arrow-width / 2) 0;
+			border-width: ($popover-arrow-width / 2) $popover-arrow-height
+				($popover-arrow-width / 2) 0;
 			left: 0;
 		}
 	}
@@ -132,13 +140,15 @@
 
 		&:after {
 			border-bottom-color: $popover-arrow-color;
-			border-width: 0 ($popover-arrow-width / 2) $popover-arrow-height ($popover-arrow-width / 2);
+			border-width: 0 ($popover-arrow-width / 2) $popover-arrow-height
+				($popover-arrow-width / 2);
 			top: $popover-border-width;
 		}
 
 		&:before {
 			border-bottom-color: $popover-arrow-outer-color;
-			border-width: 0 ($popover-arrow-width / 2) $popover-arrow-height ($popover-arrow-width / 2);
+			border-width: 0 ($popover-arrow-width / 2) $popover-arrow-height
+				($popover-arrow-width / 2);
 			top: 0;
 		}
 	}
@@ -171,13 +181,15 @@
 
 		&::after {
 			border-left-color: $popover-arrow-color;
-			border-width: ($popover-arrow-width / 2) 0 ($popover-arrow-width / 2) $popover-arrow-height;
+			border-width: ($popover-arrow-width / 2) 0
+				($popover-arrow-width / 2) $popover-arrow-height;
 			right: $popover-border-width;
 		}
 
 		&::before {
 			border-left-color: $popover-arrow-outer-color;
-			border-width: ($popover-arrow-width / 2) 0 ($popover-arrow-width / 2) $popover-arrow-height;
+			border-width: ($popover-arrow-width / 2) 0
+				($popover-arrow-width / 2) $popover-arrow-height;
 			right: 0;
 		}
 	}
@@ -241,4 +253,4 @@
 	.arrow {
 		top: $popover-arrow-offset;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_progress-bars.scss b/packages/clay-css/src/scss/components/_progress-bars.scss
index 476971ebb0..f7204d2217 100644
--- a/packages/clay-css/src/scss/components/_progress-bars.scss
+++ b/packages/clay-css/src/scss/components/_progress-bars.scss
@@ -79,4 +79,4 @@
 			color: map-get($value, group-feedback-color);
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_quick-action.scss b/packages/clay-css/src/scss/components/_quick-action.scss
index 39d42eb11e..045e5a262f 100644
--- a/packages/clay-css/src/scss/components/_quick-action.scss
+++ b/packages/clay-css/src/scss/components/_quick-action.scss
@@ -38,4 +38,4 @@
 	.lexicon-icon {
 		margin-top: 0;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_range.scss b/packages/clay-css/src/scss/components/_range.scss
index 95900ca083..619b5e2e0f 100644
--- a/packages/clay-css/src/scss/components/_range.scss
+++ b/packages/clay-css/src/scss/components/_range.scss
@@ -42,4 +42,4 @@
 	.input-group {
 		align-items: flex-end;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_sheets.scss b/packages/clay-css/src/scss/components/_sheets.scss
index 6278512728..403f39d02b 100644
--- a/packages/clay-css/src/scss/components/_sheets.scss
+++ b/packages/clay-css/src/scss/components/_sheets.scss
@@ -11,14 +11,14 @@
 	@include border-radius($sheet-border-radius);
 
 	padding-bottom: $sheet-padding-bottom;
-	padding-left:  $sheet-padding-left;
-	padding-right:  $sheet-padding-right;
+	padding-left: $sheet-padding-left;
+	padding-right: $sheet-padding-right;
 	padding-top: $sheet-padding-top;
 
 	@include clay-scale-component {
 		padding-bottom: $sheet-padding-bottom-mobile;
-		padding-left:  $sheet-padding-left-mobile;
-		padding-right:  $sheet-padding-right-mobile;
+		padding-left: $sheet-padding-left-mobile;
+		padding-right: $sheet-padding-right-mobile;
 		padding-top: $sheet-padding-top-mobile;
 	}
 
@@ -189,8 +189,12 @@ fieldset {
 
 		@if ($enable-c-inner) {
 			.c-inner {
-				margin-left: #{math-sign($sheet-subtitle-collapse-icon-padding-left)};
-				margin-right: #{math-sign($sheet-subtitle-collapse-icon-padding-right)};
+				margin-left: #{math-sign(
+						$sheet-subtitle-collapse-icon-padding-left
+					)};
+				margin-right: #{math-sign(
+						$sheet-subtitle-collapse-icon-padding-right
+					)};
 			}
 		}
 	}
@@ -254,4 +258,4 @@ a.sheet-subtitle {
 		font-size: $sheet-text-font-size-mobile;
 		margin-bottom: $sheet-text-margin-bottom-mobile;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_side-navigation.scss b/packages/clay-css/src/scss/components/_side-navigation.scss
index a701576145..a82c7c0a7a 100644
--- a/packages/clay-css/src/scss/components/_side-navigation.scss
+++ b/packages/clay-css/src/scss/components/_side-navigation.scss
@@ -133,4 +133,4 @@
 			right: 0;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_stickers.scss b/packages/clay-css/src/scss/components/_stickers.scss
index 52dbbdf059..d28c5a062f 100644
--- a/packages/clay-css/src/scss/components/_stickers.scss
+++ b/packages/clay-css/src/scss/components/_stickers.scss
@@ -149,4 +149,4 @@
 .sticker-circle,
 .sticker-circle .sticker-overlay {
 	@include border-radius($sticker-circle-border-radius);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_tables.scss b/packages/clay-css/src/scss/components/_tables.scss
index d37d98f629..c84ec16e85 100644
--- a/packages/clay-css/src/scss/components/_tables.scss
+++ b/packages/clay-css/src/scss/components/_tables.scss
@@ -134,7 +134,11 @@ th {
 	thead {
 		td,
 		th {
-			@if ($table-head-border-top-width == 0 and $table-head-border-top-width) {
+			@if (
+				$table-head-border-top-width ==
+					0 and
+					$table-head-border-top-width
+			) {
 				border-top-width: $table-border-width;
 			}
 		}
@@ -325,14 +329,14 @@ th {
 	td {
 		// top, bottom
 		box-shadow: inset 0 #{$table-list-border-y-width} $table-list-border-color,
-					0 #{$table-list-border-y-width} $table-list-border-color;
+			0 #{$table-list-border-y-width} $table-list-border-color;
 		padding-top: $table-list-border-y-width + $table-cell-padding;
 
 		&:first-child {
 			// top, bottom, left
 			box-shadow: inset 0 #{$table-list-border-y-width} $table-list-border-color,
-						0 #{$table-list-border-y-width} $table-list-border-color,
-						inset #{$table-list-border-x-width} 0 $table-list-border-color;
+				0 #{$table-list-border-y-width} $table-list-border-color,
+				inset #{$table-list-border-x-width} 0 $table-list-border-color;
 			padding-left: $table-list-border-x-width + $table-cell-padding;
 			padding-top: $table-list-border-y-width + $table-cell-padding;
 		}
@@ -340,8 +344,8 @@ th {
 		&:last-child {
 			// top, right, bottom
 			box-shadow: inset 0 #{$table-list-border-y-width} $table-list-border-color,
-						inset #{-$table-list-border-x-width} 0 $table-list-border-color,
-						0 #{$table-list-border-y-width} $table-list-border-color;
+				inset #{-$table-list-border-x-width} 0 $table-list-border-color,
+				0 #{$table-list-border-y-width} $table-list-border-color;
 			padding-right: $table-list-border-x-width + $table-cell-padding;
 			padding-top: $table-list-border-y-width + $table-cell-padding;
 		}
@@ -349,9 +353,9 @@ th {
 		&:only-child {
 			// top, right, bottom, left
 			box-shadow: inset 0 #{$table-list-border-y-width} $table-list-border-color,
-						inset #{-$table-list-border-x-width} 0 $table-list-border-color,
-						0 #{$table-list-border-y-width} $table-list-border-color,
-						inset #{$table-list-border-x-width} 0 $table-list-border-color;
+				inset #{-$table-list-border-x-width} 0 $table-list-border-color,
+				0 #{$table-list-border-y-width} $table-list-border-color,
+				inset #{$table-list-border-x-width} 0 $table-list-border-color;
 			padding-left: $table-list-border-x-width + $table-cell-padding;
 			padding-right: $table-list-border-x-width + $table-cell-padding;
 			padding-top: $table-list-border-y-width + $table-cell-padding;
@@ -361,8 +365,8 @@ th {
 	.table-cell-start {
 		// top, bottom, left
 		box-shadow: inset 0 #{$table-list-border-y-width} $table-list-border-color,
-					0 #{$table-list-border-y-width} $table-list-border-color,
-					inset #{$table-list-border-x-width} 0 $table-list-border-color;
+			0 #{$table-list-border-y-width} $table-list-border-color,
+			inset #{$table-list-border-x-width} 0 $table-list-border-color;
 		padding-left: $table-list-border-x-width + $table-cell-padding;
 		padding-top: $table-list-border-y-width + $table-cell-padding;
 	}
@@ -370,8 +374,8 @@ th {
 	.table-cell-end {
 		// top, right, bottom
 		box-shadow: inset 0 #{$table-list-border-y-width} $table-list-border-color,
-					inset #{-$table-list-border-x-width} 0 $table-list-border-color,
-					0 #{$table-list-border-y-width} $table-list-border-color;
+			inset #{-$table-list-border-x-width} 0 $table-list-border-color,
+			0 #{$table-list-border-y-width} $table-list-border-color;
 		padding-right: $table-list-border-x-width + $table-cell-padding;
 		padding-top: $table-list-border-y-width + $table-cell-padding;
 	}
@@ -414,17 +418,17 @@ th {
 	td {
 		// top, right, bottom
 		box-shadow: inset 0 #{$table-list-border-y-width} #{$table-list-border-color},
-					inset #{-$table-list-border-x-width} 0 #{$table-list-border-color},
-					0 #{$table-list-border-y-width} #{$table-list-border-color};
+			inset #{-$table-list-border-x-width} 0 #{$table-list-border-color},
+			0 #{$table-list-border-y-width} #{$table-list-border-color};
 		padding-right: $table-list-border-x-width + $table-cell-padding;
 		padding-top: $table-list-border-y-width + $table-cell-padding;
 
 		&:first-child {
 			// top, right, bottom, left
 			box-shadow: inset 0 #{$table-list-border-y-width} #{$table-list-border-color},
-						inset #{-$table-list-border-x-width} 0 #{$table-list-border-color},
-						0 #{$table-list-border-y-width} #{$table-list-border-color},
-						inset #{$table-list-border-x-width} 0 #{$table-list-border-color};
+				inset #{-$table-list-border-x-width} 0 #{$table-list-border-color},
+				0 #{$table-list-border-y-width} #{$table-list-border-color},
+				inset #{$table-list-border-x-width} 0 #{$table-list-border-color};
 			padding-left: $table-list-border-x-width + $table-cell-padding;
 			padding-right: $table-list-border-x-width + $table-cell-padding;
 			padding-top: $table-list-border-y-width + $table-cell-padding;
@@ -601,7 +605,8 @@ th {
 	th {
 		padding-bottom: $table-list-divider-padding-y;
 		padding-left: $table-list-border-x-width + $table-list-divider-padding-x;
-		padding-right: $table-list-border-x-width + $table-list-divider-padding-x;
+		padding-right: $table-list-border-x-width +
+			$table-list-divider-padding-x;
 		padding-top: $table-list-border-y-width + $table-list-divider-padding-y;
 	}
 }
@@ -907,4 +912,4 @@ th {
 		max-width: none;
 		width: auto;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_time.scss b/packages/clay-css/src/scss/components/_time.scss
index 00cbc4bc38..b65a4cf97a 100644
--- a/packages/clay-css/src/scss/components/_time.scss
+++ b/packages/clay-css/src/scss/components/_time.scss
@@ -62,4 +62,4 @@
 	.btn {
 		@include clay-button-variant($clay-time-inner-spin-btn);
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_timelines.scss b/packages/clay-css/src/scss/components/_timelines.scss
index e62e699c34..bf4bba659f 100644
--- a/packages/clay-css/src/scss/components/_timelines.scss
+++ b/packages/clay-css/src/scss/components/_timelines.scss
@@ -150,9 +150,13 @@
 }
 
 .timeline-spacing-xl {
-	@include clay-timeline-spacing($timeline-outer-spacing-xl, $timeline-inner-spacing-xl, $timeline-item-padding-y-xl);
+	@include clay-timeline-spacing(
+		$timeline-outer-spacing-xl,
+		$timeline-inner-spacing-xl,
+		$timeline-item-padding-y-xl
+	);
 
 	.timeline-increment-text {
 		max-width: $timeline-inner-spacing-xl + $timeline-outer-spacing-xl;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_toggle-switch.scss b/packages/clay-css/src/scss/components/_toggle-switch.scss
index 5293046445..31da2af7e8 100644
--- a/packages/clay-css/src/scss/components/_toggle-switch.scss
+++ b/packages/clay-css/src/scss/components/_toggle-switch.scss
@@ -17,10 +17,20 @@
 	.toggle-switch-label {
 		line-height: $simple-toggle-switch-label-line-height;
 		margin-bottom: 0;
-		max-width: calc(100% - #{clay-data-label-text-position($toggle-switch-bar-width, $toggle-switch-bar-padding)});
+		max-width: calc(
+			100% - #{clay-data-label-text-position(
+					$toggle-switch-bar-width,
+					$toggle-switch-bar-padding
+				)}
+		);
 
 		@include clay-scale-component {
-			max-width: calc(100% - #{clay-data-label-text-position($toggle-switch-bar-width-mobile, $toggle-switch-bar-padding-mobile)});
+			max-width: calc(
+				100% - #{clay-data-label-text-position(
+						$toggle-switch-bar-width-mobile,
+						$toggle-switch-bar-padding-mobile
+					)}
+			);
 		}
 	}
 }
@@ -161,7 +171,10 @@ label.toggle-switch {
 		.toggle-switch-handle {
 			&:after {
 				content: attr(data-label-off);
-				margin-left: clay-data-label-text-position($toggle-switch-bar-width, $toggle-switch-bar-padding);
+				margin-left: clay-data-label-text-position(
+					$toggle-switch-bar-width,
+					$toggle-switch-bar-padding
+				);
 				transition: $toggle-switch-transition;
 				white-space: nowrap;
 			}
@@ -190,7 +203,8 @@ label.toggle-switch {
 		}
 
 		.toggle-switch-icon-off {
-			left: $toggle-switch-bar-width - $toggle-switch-bar-padding - $toggle-switch-button-width;
+			left: $toggle-switch-bar-width - $toggle-switch-bar-padding -
+				$toggle-switch-button-width;
 		}
 
 		.button-icon {
@@ -211,7 +225,8 @@ label.toggle-switch {
 
 			border-style: solid;
 			border-width: $toggle-switch-button-border-width;
-			left: $toggle-switch-bar-width - $toggle-switch-bar-padding - $toggle-switch-button-width;
+			left: $toggle-switch-bar-width - $toggle-switch-bar-padding -
+				$toggle-switch-button-width;
 		}
 
 		&:before {
@@ -234,7 +249,8 @@ label.toggle-switch {
 
 		.button-icon {
 			color: $toggle-switch-button-on-icon-color;
-			left: $toggle-switch-bar-width - $toggle-switch-bar-padding - $toggle-switch-button-width;
+			left: $toggle-switch-bar-width - $toggle-switch-bar-padding -
+				$toggle-switch-button-width;
 		}
 
 		.button-icon-on,
@@ -317,7 +333,10 @@ label.toggle-switch {
 			}
 
 			.toggle-switch-handle:after {
-				margin-left: clay-data-label-text-position($toggle-switch-bar-width-mobile, $toggle-switch-bar-padding-mobile);
+				margin-left: clay-data-label-text-position(
+					$toggle-switch-bar-width-mobile,
+					$toggle-switch-bar-padding-mobile
+				);
 			}
 
 			.toggle-switch-icon {
@@ -332,21 +351,30 @@ label.toggle-switch {
 			}
 
 			.toggle-switch-icon-off {
-				left: $toggle-switch-bar-width-mobile - $toggle-switch-bar-padding-mobile - $toggle-switch-button-width-mobile;
+				left: $toggle-switch-bar-width-mobile -
+					$toggle-switch-bar-padding-mobile -
+					$toggle-switch-button-width-mobile;
 			}
 		}
 
 		&:checked ~ .toggle-switch-bar {
 			&:after {
-				left: $toggle-switch-bar-width-mobile - $toggle-switch-bar-padding-mobile - $toggle-switch-button-width-mobile;
+				left: $toggle-switch-bar-width-mobile -
+					$toggle-switch-bar-padding-mobile -
+					$toggle-switch-button-width-mobile;
 			}
 
 			.toggle-switch-handle:after {
-				margin-left: clay-data-label-text-position($toggle-switch-bar-width-mobile, $toggle-switch-bar-padding-mobile);
+				margin-left: clay-data-label-text-position(
+					$toggle-switch-bar-width-mobile,
+					$toggle-switch-bar-padding-mobile
+				);
 			}
 
 			.button-icon {
-				left: $toggle-switch-bar-width-mobile - $toggle-switch-bar-padding-mobile - $toggle-switch-button-width-mobile;
+				left: $toggle-switch-bar-width-mobile -
+					$toggle-switch-bar-padding-mobile -
+					$toggle-switch-button-width-mobile;
 			}
 		}
 	}
@@ -355,4 +383,4 @@ label.toggle-switch {
 	.toggle-switch-text-right {
 		line-height: $toggle-switch-bar-height-mobile;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_tooltip.scss b/packages/clay-css/src/scss/components/_tooltip.scss
index ee7810278a..cfd59db647 100644
--- a/packages/clay-css/src/scss/components/_tooltip.scss
+++ b/packages/clay-css/src/scss/components/_tooltip.scss
@@ -95,7 +95,8 @@
 
 		&::before {
 			border-left-color: $tooltip-arrow-color;
-			border-width: ($tooltip-arrow-width / 2) 0 ($tooltip-arrow-width / 2) $tooltip-arrow-height;
+			border-width: ($tooltip-arrow-width / 2) 0
+				($tooltip-arrow-width / 2) $tooltip-arrow-height;
 			left: 0;
 		}
 	}
@@ -122,7 +123,8 @@
 
 		&::before {
 			border-right-color: $tooltip-arrow-color;
-			border-width: ($tooltip-arrow-width / 2) $tooltip-arrow-height ($tooltip-arrow-width / 2) 0;
+			border-width: ($tooltip-arrow-width / 2) $tooltip-arrow-height
+				($tooltip-arrow-width / 2) 0;
 			right: 0;
 		}
 	}
@@ -158,4 +160,4 @@
 		bottom: 0;
 		left: 50%;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_type.scss b/packages/clay-css/src/scss/components/_type.scss
index 8b29061352..a8638b6b19 100644
--- a/packages/clay-css/src/scss/components/_type.scss
+++ b/packages/clay-css/src/scss/components/_type.scss
@@ -166,4 +166,4 @@ mark,
 		white-space: nowrap;
 		word-wrap: normal;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/components/_utilities.scss b/packages/clay-css/src/scss/components/_utilities.scss
index 5005dc5208..fe63d32863 100644
--- a/packages/clay-css/src/scss/components/_utilities.scss
+++ b/packages/clay-css/src/scss/components/_utilities.scss
@@ -238,7 +238,7 @@
 	@extend %autofit-float-end-md-down;
 }
 
-// C Inner 
+// C Inner
 
 @if ($enable-c-inner) {
 	.c-inner {
@@ -405,4 +405,4 @@
 			margin-left: auto;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_aspect-ratio.scss b/packages/clay-css/src/scss/mixins/_aspect-ratio.scss
index c5b667633a..36fef8163a 100644
--- a/packages/clay-css/src/scss/mixins/_aspect-ratio.scss
+++ b/packages/clay-css/src/scss/mixins/_aspect-ratio.scss
@@ -125,4 +125,4 @@
 			width: $lexicon-icon-width;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_background.scss b/packages/clay-css/src/scss/mixins/_background.scss
index b0d6013b16..8bfa059351 100644
--- a/packages/clay-css/src/scss/mixins/_background.scss
+++ b/packages/clay-css/src/scss/mixins/_background.scss
@@ -11,7 +11,10 @@
 
 @mixin clay-bg-checkered($fg-color: $gray-200, $bg-color: null) {
 	background-color: $bg-color;
-	background-image: linear-gradient(45deg, $fg-color 25%, transparent 25%), linear-gradient(-45deg, $fg-color 25%, transparent 25%), linear-gradient(45deg, transparent 75%, $fg-color 75%), linear-gradient(-45deg, transparent 75%, $fg-color 75%);
+	background-image: linear-gradient(45deg, $fg-color 25%, transparent 25%),
+		linear-gradient(-45deg, $fg-color 25%, transparent 25%),
+		linear-gradient(45deg, transparent 75%, $fg-color 75%),
+		linear-gradient(-45deg, transparent 75%, $fg-color 75%);
 	background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
 	background-size: 20px 20px;
 }
@@ -33,12 +36,21 @@
 
 @mixin clay-indicator-bg($map) {
 	$indicator: map-get($map, indicator);
-	$indicator-bg-position: setter(map-get($map, indicator-bg-position), top 0.125rem left);
+	$indicator-bg-position: setter(
+		map-get($map, indicator-bg-position),
+		top 0.125rem left
+	);
 	$indicator-bg-size: setter(map-get($map, indicator-bg-size), 100%);
 	$indicator-display: setter(map-get($map, indicator-display), inline-block);
-	$indicator-height: setter(map-get($map, indicator-height), #{$line-height-base}em);
+	$indicator-height: setter(
+		map-get($map, indicator-height),
+		#{$line-height-base}em
+	);
 	$indicator-text-indent: map-get($map, indicator-text-indent);
-	$indicator-vertical-align: setter(map-get($map, indicator-vertical-align), middle);
+	$indicator-vertical-align: setter(
+		map-get($map, indicator-vertical-align),
+		middle
+	);
 	$indicator-width: setter(map-get($map, indicator-width), 1em);
 
 	background-image: $indicator;
@@ -55,4 +67,4 @@
 	.lexicon-icon {
 		display: none;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_badges.scss b/packages/clay-css/src/scss/mixins/_badges.scss
index 6c555022e3..eb5de5ff8c 100644
--- a/packages/clay-css/src/scss/mixins/_badges.scss
+++ b/packages/clay-css/src/scss/mixins/_badges.scss
@@ -23,7 +23,10 @@
 	$padding-x: map-get($map, padding-x);
 	$padding-y: setter(map-get($map, padding-y), 0);
 
-	$lexicon-icon-height: setter(map-get($map, lexicon-icon-height), map-get($map, lexicon-icon-width));
+	$lexicon-icon-height: setter(
+		map-get($map, lexicon-icon-height),
+		map-get($map, lexicon-icon-width)
+	);
 	$lexicon-icon-margin-top: map-get($map, lexicon-icon-margin-top);
 	$lexicon-icon-width: map-get($map, lexicon-icon-width);
 
@@ -56,4 +59,4 @@
 			width: $lexicon-icon-width;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_box-shadow.scss b/packages/clay-css/src/scss/mixins/_box-shadow.scss
index c420826100..9f96844428 100644
--- a/packages/clay-css/src/scss/mixins/_box-shadow.scss
+++ b/packages/clay-css/src/scss/mixins/_box-shadow.scss
@@ -11,4 +11,4 @@
 			box-shadow: $shadow;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_buttons.scss b/packages/clay-css/src/scss/mixins/_buttons.scss
index a3b45384f1..85986acda3 100644
--- a/packages/clay-css/src/scss/mixins/_buttons.scss
+++ b/packages/clay-css/src/scss/mixins/_buttons.scss
@@ -81,101 +81,140 @@
 
 	$breakpoint-down: map-get($map, breakpoint-down);
 
-	$base: map-merge((
-		background-color: map-get($map, bg),
-	), $map);
+	$base: map-merge(
+		(
+			background-color: map-get($map, bg),
+		),
+		$map
+	);
 
 	$hover: setter(map-get($map, hover), ());
-	$hover: map-merge((
-		background-color: map-get($map, hover-bg),
-		border-color: map-get($map, hover-border-color),
-		color: map-get($map, hover-color),
-		opacity: map-get($map, hover-opacity),
-		text-decoration: map-get($map, hover-text-decoration),
-		z-index: map-get($map, hover-z-index),
-	), $hover);
+	$hover: map-merge(
+		(
+			background-color: map-get($map, hover-bg),
+			border-color: map-get($map, hover-border-color),
+			color: map-get($map, hover-color),
+			opacity: map-get($map, hover-opacity),
+			text-decoration: map-get($map, hover-text-decoration),
+			z-index: map-get($map, hover-z-index),
+		),
+		$hover
+	);
 
 	$focus: setter(map-get($map, focus), ());
-	$focus: map-merge((
-		background-color: map-get($map, focus-bg),
-		border-color: map-get($map, focus-border-color),
-		box-shadow: map-get($map, focus-box-shadow),
-		color: map-get($map, focus-color),
-		opacity: map-get($map, focus-opacity),
-		outline: map-get($map, focus-outline),
-		z-index: map-get($map, focus-z-index),
-	), $focus);
+	$focus: map-merge(
+		(
+			background-color: map-get($map, focus-bg),
+			border-color: map-get($map, focus-border-color),
+			box-shadow: map-get($map, focus-box-shadow),
+			color: map-get($map, focus-color),
+			opacity: map-get($map, focus-opacity),
+			outline: map-get($map, focus-outline),
+			z-index: map-get($map, focus-z-index),
+		),
+		$focus
+	);
 
 	$disabled: setter(map-get($map, disabled), ());
-	$disabled: map-merge((
-		background-color: map-get($map, disabled-bg),
-		border-color: map-get($map, disabled-border-color),
-		box-shadow: map-get($map, disabled-box-shadow),
-		color: map-get($map, disabled-color),
-		cursor: map-get($map, disabled-cursor),
-		opacity: map-get($map, disabled-opacity),
-		z-index: map-get($map, disabled-z-index),
-	), $disabled);
+	$disabled: map-merge(
+		(
+			background-color: map-get($map, disabled-bg),
+			border-color: map-get($map, disabled-border-color),
+			box-shadow: map-get($map, disabled-box-shadow),
+			color: map-get($map, disabled-color),
+			cursor: map-get($map, disabled-cursor),
+			opacity: map-get($map, disabled-opacity),
+			z-index: map-get($map, disabled-z-index),
+		),
+		$disabled
+	);
 
 	$active: setter(map-get($map, active), ());
-	$active: map-merge((
-		background-color: map-get($map, active-bg),
-		border-color: map-get($map, active-border-color),
-		box-shadow: map-get($map, active-box-shadow),
-		color: map-get($map, active-color),
-		opacity: map-get($map, active-opacity),
-		z-index: map-get($map, active-z-index),
-	), $active);
+	$active: map-merge(
+		(
+			background-color: map-get($map, active-bg),
+			border-color: map-get($map, active-border-color),
+			box-shadow: map-get($map, active-box-shadow),
+			color: map-get($map, active-color),
+			opacity: map-get($map, active-opacity),
+			z-index: map-get($map, active-z-index),
+		),
+		$active
+	);
 
 	$active-class-after: setter(map-get($map, active-class-after), ());
 
 	$active-focus: setter(map-get($map, active-focus), ());
-	$active-focus: map-merge((
-		box-shadow: setter(
-			map-get($map, active-focus-box-shadow), map-get($focus, box-shadow)),
-	), $active-focus);
+	$active-focus: map-merge(
+		(
+			box-shadow:
+				setter(
+					map-get($map, active-focus-box-shadow),
+					map-get($focus, box-shadow)
+				),
+		),
+		$active-focus
+	);
 
 	$lexicon-icon: setter(map-get($map, lexicon-icon), ());
-	$lexicon-icon: map-merge((
-		font-size: map-get($map, lexicon-icon-font-size),
-		margin-bottom: map-get($map, lexicon-icon-margin-bottom),
-		margin-right: map-get($map, lexicon-icon-margin-right),
-		margin-left: map-get($map, lexicon-icon-margin-left),
-		margin-top: map-get($map, lexicon-icon-margin-top),
-	), $lexicon-icon);
+	$lexicon-icon: map-merge(
+		(
+			font-size: map-get($map, lexicon-icon-font-size),
+			margin-bottom: map-get($map, lexicon-icon-margin-bottom),
+			margin-right: map-get($map, lexicon-icon-margin-right),
+			margin-left: map-get($map, lexicon-icon-margin-left),
+			margin-top: map-get($map, lexicon-icon-margin-top),
+		),
+		$lexicon-icon
+	);
 
 	$inline-item: setter(map-get($map, inline-item), ());
-	$inline-item: map-merge((
-		font-size: map-get($map, inline-item-font-size),
-	), $inline-item);
+	$inline-item: map-merge(
+		(
+			font-size: map-get($map, inline-item-font-size),
+		),
+		$inline-item
+	);
 
 	$section: setter(map-get($map, section), ());
-	$section: map-merge((
-		font-size: map-get($map, section-font-size),
-		font-weight: map-get($map, section-font-weight),
-		line-height: map-get($map, section-line-height),
-	), $section);
+	$section: map-merge(
+		(
+			font-size: map-get($map, section-font-size),
+			font-weight: map-get($map, section-font-weight),
+			line-height: map-get($map, section-line-height),
+		),
+		$section
+	);
 
 	$mobile: setter(map-get($map, mobile), ());
-	$mobile: map-merge((
-		font-size: map-get($map, font-size-mobile),
-		height: map-get($map, height-mobile),
-		padding-bottom: map-get($map, padding-bottom-mobile),
-		padding-left: map-get($map, padding-left-mobile),
-		padding-right: map-get($map, padding-right-mobile),
-		padding-top: map-get($map, padding-top-mobile),
-		width: map-get($map, width-mobile),
-	), $mobile);
-
-	$loading-animation: setter(map-get($map, loading-animation), $clay-unset-placeholder);
+	$mobile: map-merge(
+		(
+			font-size: map-get($map, font-size-mobile),
+			height: map-get($map, height-mobile),
+			padding-bottom: map-get($map, padding-bottom-mobile),
+			padding-left: map-get($map, padding-left-mobile),
+			padding-right: map-get($map, padding-right-mobile),
+			padding-top: map-get($map, padding-top-mobile),
+			width: map-get($map, width-mobile),
+		),
+		$mobile
+	);
+
+	$loading-animation: setter(
+		map-get($map, loading-animation),
+		$clay-unset-placeholder
+	);
 
 	$c-inner: setter(map-get($map, c-inner), ());
-	$c-inner: map-merge((
-		margin-bottom: math-sign(map-get($map, padding-bottom)),
-		margin-left: math-sign(map-get($map, padding-left)),
-		margin-right: math-sign(map-get($map, padding-right)),
-		margin-top: math-sign(map-get($map, padding-top)),
-	), $c-inner);
+	$c-inner: map-merge(
+		(
+			margin-bottom: math-sign(map-get($map, padding-bottom)),
+			margin-left: math-sign(map-get($map, padding-left)),
+			margin-right: math-sign(map-get($map, padding-right)),
+			margin-top: math-sign(map-get($map, padding-top)),
+		),
+		$c-inner
+	);
 
 	@if ($enabled) {
 		@include clay-css($base);
diff --git a/packages/clay-css/src/scss/mixins/_cards.scss b/packages/clay-css/src/scss/mixins/_cards.scss
index 79c8b58210..41e141e774 100644
--- a/packages/clay-css/src/scss/mixins/_cards.scss
+++ b/packages/clay-css/src/scss/mixins/_cards.scss
@@ -407,33 +407,63 @@
 @mixin clay-card-type-asset($map) {
 	$enabled: setter(map-get($map, enabled), true);
 
-	$aspect-ratio-border-color: setter(map-get($map, aspect-ratio-border-color), $card-border-color);
-	$aspect-ratio-border-style: setter(map-get($map, aspect-ratio-border-style), solid);
+	$aspect-ratio-border-color: setter(
+		map-get($map, aspect-ratio-border-color),
+		$card-border-color
+	);
+	$aspect-ratio-border-style: setter(
+		map-get($map, aspect-ratio-border-style),
+		solid
+	);
 
 	// The Sass map key name `aspect-ratio-border-bottom-width` is deprecated as of v2.5.1 use `aspect-ratio-border-width` instead
-	$aspect-ratio-border-bottom-width: setter(map-get($map, aspect-ratio-border-bottom-width), 0 0 0.0625rem 0); // 0 0 1px 0
+	$aspect-ratio-border-bottom-width: setter(
+		map-get($map, aspect-ratio-border-bottom-width),
+		0 0 0.0625rem 0
+	); // 0 0 1px 0
 
 	$aspect-ratio-border-width: map-get($map, aspect-ratio-border-width);
-	$aspect-ratio-horizontal: setter(map-get($map, aspect-ratio-horizontal), 16);
+	$aspect-ratio-horizontal: setter(
+		map-get($map, aspect-ratio-horizontal),
+		16
+	);
 	$aspect-ratio-vertical: setter(map-get($map, aspect-ratio-vertical), 9);
 
 	$card-body-padding-bottom: map-get($map, card-body-padding-bottom);
 	$card-body-padding-left: map-get($map, card-body-padding-left);
 	$card-body-padding-right: map-get($map, card-body-padding-right);
 	$card-body-padding-top: map-get($map, card-body-padding-top);
-	$card-row-align-items: setter(map-get($map, card-row-align-items), flex-start);
+	$card-row-align-items: setter(
+		map-get($map, card-row-align-items),
+		flex-start
+	);
 
 	$checkbox-cursor: setter(map-get($map, checkbox-cursor), $link-cursor);
 
 	$asset-icon-color: map-get($map, asset-icon-color);
 	$asset-icon-width: setter(map-get($map, asset-icon-width), 22.225%);
-	$asset-icon-sticker-border-radius: setter(map-get($map, asset-icon-sticker-border-radius), 50%);
-	$asset-icon-sticker-font-size: setter(map-get($map, asset-icon-sticker-font-size), 2vw);
-
-	$dropdown-action-offset-bottom: map-get($map, dropdown-action-offset-bottom);
+	$asset-icon-sticker-border-radius: setter(
+		map-get($map, asset-icon-sticker-border-radius),
+		50%
+	);
+	$asset-icon-sticker-font-size: setter(
+		map-get($map, asset-icon-sticker-font-size),
+		2vw
+	);
+
+	$dropdown-action-offset-bottom: map-get(
+		$map,
+		dropdown-action-offset-bottom
+	);
 	$dropdown-action-offset-left: map-get($map, dropdown-action-offset-left);
-	$dropdown-action-offset-right: setter(map-get($map, dropdown-action-offset-right), -0.5rem); // -8px
-	$dropdown-action-offset-top: setter(map-get($map, dropdown-action-offset-top), -0.1875rem); // -3px
+	$dropdown-action-offset-right: setter(
+		map-get($map, dropdown-action-offset-right),
+		-0.5rem
+	); // -8px
+	$dropdown-action-offset-top: setter(
+		map-get($map, dropdown-action-offset-top),
+		-0.1875rem
+	); // -3px
 
 	@if ($enabled) {
 		.aspect-ratio {
@@ -446,7 +476,10 @@
 				border-width: $aspect-ratio-border-bottom-width;
 			}
 
-			@include clay-aspect-ratio($aspect-ratio-horizontal, $aspect-ratio-vertical);
+			@include clay-aspect-ratio(
+				$aspect-ratio-horizontal,
+				$aspect-ratio-vertical
+			);
 
 			.custom-control label,
 			.form-check-label {
@@ -515,7 +548,7 @@
 /// @example
 /// enabled: {Bool}, // Set to false to prevent mixin styles from being output. Default: true
 /// aspect-ratio-bg: {Color | String | Null},
-/// aspect-ratio-checkered-fg: {Color | Null}, // Pass parameter to `clay-bg-checkered` mixin 
+/// aspect-ratio-checkered-fg: {Color | Null}, // Pass parameter to `clay-bg-checkered` mixin
 /// aspect-ratio-checkered-bg: {Color},
 /// asset-icon-color: {Color | String | Null},
 /// asset-icon-max-width: {Number | String | Null},
@@ -539,8 +572,14 @@
 	$asset-icon-min-width: map-get($map, asset-icon-min-width);
 	$asset-icon-width: map-get($map, asset-icon-width);
 
-	$asset-icon-lexicon-icon-height: map-get($map, asset-icon-lexicon-icon-height);
-	$asset-icon-lexicon-icon-width: map-get($map, asset-icon-lexicon-icon-width);
+	$asset-icon-lexicon-icon-height: map-get(
+		$map,
+		asset-icon-lexicon-icon-height
+	);
+	$asset-icon-lexicon-icon-width: map-get(
+		$map,
+		asset-icon-lexicon-icon-width
+	);
 
 	@if ($enabled) {
 		.aspect-ratio {
@@ -596,9 +635,15 @@
 	$sticker-line-height: map-get($map, sticker-line-height);
 	$sticker-size: map-get($map, sticker-size);
 
-	$dropdown-action-offset-bottom: map-get($map, dropdown-action-offset-bottom);
+	$dropdown-action-offset-bottom: map-get(
+		$map,
+		dropdown-action-offset-bottom
+	);
 	$dropdown-action-offset-left: map-get($map, dropdown-action-offset-left);
-	$dropdown-action-offset-right: setter(map-get($map, dropdown-action-offset-right), -0.5rem); // -8px
+	$dropdown-action-offset-right: setter(
+		map-get($map, dropdown-action-offset-right),
+		-0.5rem
+	); // -8px
 	$dropdown-action-offset-top: map-get($map, dropdown-action-offset-top);
 
 	@if ($enabled) {
@@ -619,8 +664,12 @@
 		.sticker {
 			font-size: $sticker-font-size;
 			height: $sticker-size;
-			line-height: if($sticker-line-height, $sticker-line-height, $sticker-size);
+			line-height: if(
+				$sticker-line-height,
+				$sticker-line-height,
+				$sticker-size
+			);
 			width: $sticker-size;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_close.scss b/packages/clay-css/src/scss/mixins/_close.scss
index 518726f1b5..522207cd89 100644
--- a/packages/clay-css/src/scss/mixins/_close.scss
+++ b/packages/clay-css/src/scss/mixins/_close.scss
@@ -50,68 +50,92 @@
 @mixin clay-close($map) {
 	$enabled: setter(map-get($map, enabled), true);
 
-	$base: map-merge((
-		background-color: map-get($map, bg),
-	), $map);
+	$base: map-merge(
+		(
+			background-color: map-get($map, bg),
+		),
+		$map
+	);
 
 	$hover: setter(map-get($map, hover), ());
-	$hover: map-merge((
-		background-color: map-get($map, hover-bg),
-		color: map-get($map, hover-color),
-		opacity: map-get($map, hover-opacity),
-		text-decoration: map-get($map, hover-text-decoration),
-	), $hover);
+	$hover: map-merge(
+		(
+			background-color: map-get($map, hover-bg),
+			color: map-get($map, hover-color),
+			opacity: map-get($map, hover-opacity),
+			text-decoration: map-get($map, hover-text-decoration),
+		),
+		$hover
+	);
 
 	$focus: setter(map-get($map, focus), ());
-	$focus: map-merge((
-		background-color: map-get($map, focus-bg),
-		box-shadow: map-get($map, focus-box-shadow),
-		color: map-get($map, focus-color),
-		opacity: map-get($map, focus-opacity),
-		outline: map-get($map, focus-outline),
-		text-decoration: map-get($map, focus-text-decoration),
-	), $focus);
+	$focus: map-merge(
+		(
+			background-color: map-get($map, focus-bg),
+			box-shadow: map-get($map, focus-box-shadow),
+			color: map-get($map, focus-color),
+			opacity: map-get($map, focus-opacity),
+			outline: map-get($map, focus-outline),
+			text-decoration: map-get($map, focus-text-decoration),
+		),
+		$focus
+	);
 
 	$disabled: setter(map-get($map, disabled), ());
-	$disabled: map-merge((
-		background-color: map-get($map, disabled-bg),
-		border-color: map-get($map, disabled-border-color),
-		box-shadow: map-get($map, disabled-box-shadow),
-		color: map-get($map, disabled-color),
-		cursor: map-get($map, disabled-cursor),
-		opacity: map-get($map, disabled-opacity),
-		pointer-events: map-get($map, disabled-pointer-events),
-		text-decoration: map-get($map, disabled-text-decoration),
-	), $disabled);
+	$disabled: map-merge(
+		(
+			background-color: map-get($map, disabled-bg),
+			border-color: map-get($map, disabled-border-color),
+			box-shadow: map-get($map, disabled-box-shadow),
+			color: map-get($map, disabled-color),
+			cursor: map-get($map, disabled-cursor),
+			opacity: map-get($map, disabled-opacity),
+			pointer-events: map-get($map, disabled-pointer-events),
+			text-decoration: map-get($map, disabled-text-decoration),
+		),
+		$disabled
+	);
 
 	$active: setter(map-get($map, active), ());
-	$active: map-merge((
-		background-color: map-get($map, active-bg),
-		border-color: map-get($map, active-border-color),
-		color: map-get($map, active-color),
-	), $active);
+	$active: map-merge(
+		(
+			background-color: map-get($map, active-bg),
+			border-color: map-get($map, active-border-color),
+			color: map-get($map, active-color),
+		),
+		$active
+	);
 
 	$btn-focus: setter(map-get($map, btn-focus), ());
-	$btn-focus: map-merge((
-		box-shadow: map-get($map, btn-focus-box-shadow),
-		outline: map-get($map, btn-focus-outline),
-	), $btn-focus);
+	$btn-focus: map-merge(
+		(
+			box-shadow: map-get($map, btn-focus-box-shadow),
+			outline: map-get($map, btn-focus-outline),
+		),
+		$btn-focus
+	);
 
 	$lexicon-icon: setter(map-get($map, lexicon-icon), ());
-	$lexicon-icon: map-merge((
-		margin-bottom: map-get($map, lexicon-icon-margin-bottom),
-		margin-left: map-get($map, lexicon-icon-margin-left),
-		margin-right: map-get($map, lexicon-icon-margin-right),
-		margin-top: map-get($map, lexicon-icon-margin-top),
-	), $lexicon-icon);
+	$lexicon-icon: map-merge(
+		(
+			margin-bottom: map-get($map, lexicon-icon-margin-bottom),
+			margin-left: map-get($map, lexicon-icon-margin-left),
+			margin-right: map-get($map, lexicon-icon-margin-right),
+			margin-top: map-get($map, lexicon-icon-margin-top),
+		),
+		$lexicon-icon
+	);
 
 	$c-inner: setter(map-get($map, c-inner), ());
-	$c-inner: map-merge((
-		margin-bottom: math-sign(map-get($map, padding-bottom)),
-		margin-left: math-sign(map-get($map, padding-left)),
-		margin-right: math-sign(map-get($map, padding-right)),
-		margin-top: math-sign(map-get($map, padding-top)),
-	), $c-inner);
+	$c-inner: map-merge(
+		(
+			margin-bottom: math-sign(map-get($map, padding-bottom)),
+			margin-left: math-sign(map-get($map, padding-left)),
+			margin-right: math-sign(map-get($map, padding-right)),
+			margin-top: math-sign(map-get($map, padding-top)),
+		),
+		$c-inner
+	);
 
 	@if ($enabled) {
 		@include clay-css($base);
diff --git a/packages/clay-css/src/scss/mixins/_dropdown-menu.scss b/packages/clay-css/src/scss/mixins/_dropdown-menu.scss
index c04cc24704..48656edb80 100644
--- a/packages/clay-css/src/scss/mixins/_dropdown-menu.scss
+++ b/packages/clay-css/src/scss/mixins/_dropdown-menu.scss
@@ -236,7 +236,10 @@
 	$active-font-weight: map-get($map, active-font-weight);
 	$active-text-decoration: map-get($map, active-text-decoration);
 
-	$active-c-kbd-inline: map-deep-merge((), map-get($map, active-c-kbd-inline));
+	$active-c-kbd-inline: map-deep-merge(
+		(),
+		map-get($map, active-c-kbd-inline)
+	);
 
 	$active-class-bg: map-get($map, active-class-bg);
 	$active-class-border-color: map-get($map, active-class-border-color);
@@ -244,7 +247,10 @@
 	$active-class-font-weight: map-get($map, active-class-font-weight);
 	$active-class-text-decoration: map-get($map, active-class-text-decoration);
 
-	$active-class-c-kbd-inline: map-deep-merge((), map-get($map, active-class-c-kbd-inline));
+	$active-class-c-kbd-inline: map-deep-merge(
+		(),
+		map-get($map, active-class-c-kbd-inline)
+	);
 
 	$disabled-bg: map-get($map, disabled-bg);
 	$disabled-border-color: map-get($map, disabled-border-color);
@@ -256,23 +262,32 @@
 	$disabled-pointer-events: map-get($map, disabled-pointer-events);
 	$disabled-text-decoration: map-get($map, disabled-text-decoration);
 
-	$disabled-c-kbd-inline: map-deep-merge((), map-get($map, disabled-c-kbd-inline));
+	$disabled-c-kbd-inline: map-deep-merge(
+		(),
+		map-get($map, disabled-c-kbd-inline)
+	);
 
-	$disabled-active-pointer-events: map-get($map, disabled-active-pointer-events);
+	$disabled-active-pointer-events: map-get(
+		$map,
+		disabled-active-pointer-events
+	);
 
 	$autofit-row: map-deep-merge((), map-get($map, autofit-row));
 
 	$c-kbd-inline: map-deep-merge((), map-get($map, c-kbd-inline));
 
 	$c-inner: setter(map-get($map, c-inner), ());
-	$c-inner: map-deep-merge((
-		flex-grow: 1,
-		margin-bottom: math-sign($padding-bottom),
-		margin-left: math-sign($padding-left),
-		margin-right: math-sign($padding-right),
-		margin-top: math-sign($padding-top),
-		width: auto,
-	), $c-inner);
+	$c-inner: map-deep-merge(
+		(
+			flex-grow: 1,
+			margin-bottom: math-sign($padding-bottom),
+			margin-left: math-sign($padding-left),
+			margin-right: math-sign($padding-right),
+			margin-top: math-sign($padding-top),
+			width: auto,
+		),
+		$c-inner
+	);
 
 	@if ($enabled) {
 		background-color: $bg; // For `<button>`s set to `transparent` in Bootstrap
@@ -434,4 +449,4 @@
 			font-weight: $font-weight;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_forms.scss b/packages/clay-css/src/scss/mixins/_forms.scss
index 24f7c7ab1d..38682d6c83 100644
--- a/packages/clay-css/src/scss/mixins/_forms.scss
+++ b/packages/clay-css/src/scss/mixins/_forms.scss
@@ -60,38 +60,56 @@
 @mixin clay-form-control-variant($map) {
 	$enabled: setter(map-get($map, enabled), true);
 
-	$placeholder: map-deep-merge((
-		color: map-get($map, placeholder-color),
-		opacity: map-get($map, placeholder-opacity),
-	), map-get($map, placeholder));
-
-	$selection: map-deep-merge((
-		background-color: map-get($map, selection-bg),
-		color: map-get($map, selection-color),
-	), map-get($map, selection));
-
-	$hover: map-deep-merge((
-		background-color: map-get($map, hover-bg),
-		border-color: map-get($map, hover-border-color),
-		box-shadow: map-get($map, hover-box-shadow),
-		color: map-get($map, hover-color),
-	), map-get($map, hover));
-
-	$hover-placeholder: map-deep-merge((
-		color: map-get($map, hover-placeholder-color),
-	), map-get($map, hover-placeholder));
-
-	$focus: map-deep-merge((
-		background-color: map-get($map, focus-bg),
-		background-image: map-get($map, focus-bg-image),
-		border-color: map-get($map, focus-border-color),
-		box-shadow: map-get($map, focus-box-shadow),
-		color: map-get($map, focus-color),
-	), map-get($map, focus));
-
-	$focus-placeholder: map-deep-merge((
-		color: map-get($map, focus-placeholder-color),
-	), map-get($map, focus-placeholder));
+	$placeholder: map-deep-merge(
+		(
+			color: map-get($map, placeholder-color),
+			opacity: map-get($map, placeholder-opacity),
+		),
+		map-get($map, placeholder)
+	);
+
+	$selection: map-deep-merge(
+		(
+			background-color: map-get($map, selection-bg),
+			color: map-get($map, selection-color),
+		),
+		map-get($map, selection)
+	);
+
+	$hover: map-deep-merge(
+		(
+			background-color: map-get($map, hover-bg),
+			border-color: map-get($map, hover-border-color),
+			box-shadow: map-get($map, hover-box-shadow),
+			color: map-get($map, hover-color),
+		),
+		map-get($map, hover)
+	);
+
+	$hover-placeholder: map-deep-merge(
+		(
+			color: map-get($map, hover-placeholder-color),
+		),
+		map-get($map, hover-placeholder)
+	);
+
+	$focus: map-deep-merge(
+		(
+			background-color: map-get($map, focus-bg),
+			background-image: map-get($map, focus-bg-image),
+			border-color: map-get($map, focus-border-color),
+			box-shadow: map-get($map, focus-box-shadow),
+			color: map-get($map, focus-color),
+		),
+		map-get($map, focus)
+	);
+
+	$focus-placeholder: map-deep-merge(
+		(
+			color: map-get($map, focus-placeholder-color),
+		),
+		map-get($map, focus-placeholder)
+	);
 
 	// deprecated after v2.18.0 [readonly] can have hover focus styles, declare a separate selector and use `clay-form-control-variant` mixin (e.g., `.form-control[readonly] { @include clay-form-control-variant($the-readonly-map); }`).
 
@@ -104,19 +122,25 @@
 	$readonly-opacity: map-get($map, readonly-opacity);
 	$readonly-placeholder-color: map-get($map, readonly-placeholder-color);
 
-	$disabled: map-deep-merge((
-		background-color: map-get($map, disabled-bg),
-		background-image: map-get($map, disabled-bg-image),
-		border-color: map-get($map, disabled-border-color),
-		box-shadow: map-get($map, disabled-box-shadow),
-		color: map-get($map, disabled-color),
-		cursor: map-get($map, disabled-cursor),
-		opacity: map-get($map, disabled-opacity),
-	), map-get($map, disabled));
-
-	$disabled-placeholder: map-deep-merge((
-		color: map-get($map, disabled-placeholder-color),
-	), map-get($map, disabled-placeholder));
+	$disabled: map-deep-merge(
+		(
+			background-color: map-get($map, disabled-bg),
+			background-image: map-get($map, disabled-bg-image),
+			border-color: map-get($map, disabled-border-color),
+			box-shadow: map-get($map, disabled-box-shadow),
+			color: map-get($map, disabled-color),
+			cursor: map-get($map, disabled-cursor),
+			opacity: map-get($map, disabled-opacity),
+		),
+		map-get($map, disabled)
+	);
+
+	$disabled-placeholder: map-deep-merge(
+		(
+			color: map-get($map, disabled-placeholder-color),
+		),
+		map-get($map, disabled-placeholder)
+	);
 
 	@if ($enabled) {
 		@include clay-css($map);
@@ -202,34 +226,46 @@
 /// - Add @link to documentation
 
 @mixin clay-select-variant($map) {
-	$hover: map-deep-merge((
-		background-color: map-get($map, hover-bg),
-		border-color: map-get($map, hover-border-color),
-		box-shadow: map-get($map, hover-box-shadow),
-		color: map-get($map, hover-color),
-	), map-get($map, hover));
-
-	$focus: map-deep-merge((
-		background-color: map-get($map, focus-bg),
-		background-image: map-get($map, focus-bg-image),
-		border-color: map-get($map, focus-border-color),
-		box-shadow: map-get($map, focus-box-shadow),
-		color: map-get($map, focus-color),
-	), map-get($map, focus));
-
-	$disabled: map-deep-merge((
-		background-color: map-get($map, disabled-bg),
-		background-image: map-get($map, disabled-bg-image),
-		border-color: map-get($map, disabled-border-color),
-		box-shadow: map-get($map, disabled-box-shadow),
-		color: map-get($map, disabled-color),
-		cursor: map-get($map, disabled-cursor),
-		opacity: map-get($map, disabled-opacity),
-	), map-get($map, disabled));
-
-	$disabled-option: map-deep-merge((
-		color: map-get($map, disabled-color),
-	), map-get($map, disabled-option));
+	$hover: map-deep-merge(
+		(
+			background-color: map-get($map, hover-bg),
+			border-color: map-get($map, hover-border-color),
+			box-shadow: map-get($map, hover-box-shadow),
+			color: map-get($map, hover-color),
+		),
+		map-get($map, hover)
+	);
+
+	$focus: map-deep-merge(
+		(
+			background-color: map-get($map, focus-bg),
+			background-image: map-get($map, focus-bg-image),
+			border-color: map-get($map, focus-border-color),
+			box-shadow: map-get($map, focus-box-shadow),
+			color: map-get($map, focus-color),
+		),
+		map-get($map, focus)
+	);
+
+	$disabled: map-deep-merge(
+		(
+			background-color: map-get($map, disabled-bg),
+			background-image: map-get($map, disabled-bg-image),
+			border-color: map-get($map, disabled-border-color),
+			box-shadow: map-get($map, disabled-box-shadow),
+			color: map-get($map, disabled-color),
+			cursor: map-get($map, disabled-cursor),
+			opacity: map-get($map, disabled-opacity),
+		),
+		map-get($map, disabled)
+	);
+
+	$disabled-option: map-deep-merge(
+		(
+			color: map-get($map, disabled-color),
+		),
+		map-get($map, disabled-option)
+	);
 
 	$option: map-deep-merge((), map-get($map, option));
 
@@ -725,4 +761,4 @@
 		top: $data-label-top;
 		width: $data-label-width;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_globals.scss b/packages/clay-css/src/scss/mixins/_globals.scss
index 72d229e13a..c22c7cb87d 100644
--- a/packages/clay-css/src/scss/mixins/_globals.scss
+++ b/packages/clay-css/src/scss/mixins/_globals.scss
@@ -200,7 +200,7 @@
 		'word-break',
 		'word-spacing',
 		'writing-mode',
-		'z-index',
+		'z-index'
 	);
 
 	$enabled: setter(map-get($map, enabled), true);
@@ -216,22 +216,18 @@
 				}
 
 				appearance: map-get($map, appearance);
-			}
-			@else if ($key == 'word-wrap') {
+			} @else if ($key == 'word-wrap') {
 				overflow-wrap: map-get($map, word-wrap);
 				word-wrap: map-get($map, word-wrap);
-			}
-			@else if ($key == 'overflow-wrap') {
+			} @else if ($key == 'overflow-wrap') {
 				overflow-wrap: map-get($map, overflow-wrap);
 				word-wrap: map-get($map, overflow-wrap);
-			}
-			@else if ($key == 'user-select') {
+			} @else if ($key == 'user-select') {
 				-ms-user-select: map-get($map, user-select);
 				-moz-user-select: map-get($map, user-select);
 				-webkit-user-select: map-get($map, user-select);
 				user-select: map-get($map, user-select);
-			}
-			@else if (index($properties, $key)) {
+			} @else if (index($properties, $key)) {
 				#{$key}: #{$value};
 			}
 		}
diff --git a/packages/clay-css/src/scss/mixins/_grid.scss b/packages/clay-css/src/scss/mixins/_grid.scss
index 949c1a106b..e9e78370d1 100644
--- a/packages/clay-css/src/scss/mixins/_grid.scss
+++ b/packages/clay-css/src/scss/mixins/_grid.scss
@@ -13,7 +13,7 @@
 		margin-right: 0;
 
 		> .col,
-		> [class*="col-"] {
+		> [class*='col-'] {
 			padding-right: 0;
 			padding-left: 0;
 		}
@@ -46,25 +46,31 @@
 	$breakpoint-up: map-get($map, breakpoint-up);
 	$breakpoint-down: setter(clay-breakpoint-prev($breakpoint-up), null);
 
-	$base: map-merge((
-		background-color: map-get($map, bg),
-		background-image: map-get($map, bg-image),
-		background-position: map-get($map, bg-position),
-		background-size: map-get($map, bg-size),
-	), $map);
+	$base: map-merge(
+		(
+			background-color: map-get($map, bg),
+			background-image: map-get($map, bg-image),
+			background-position: map-get($map, bg-position),
+			background-size: map-get($map, bg-size),
+		),
+		$map
+	);
 
 	$mobile: setter(map-get($map, mobile), ());
-	$mobile: map-merge((
-		padding-bottom: map-get($map, padding-bottom-mobile),
-		padding-left: map-get($map, padding-left-mobile),
-		padding-right: map-get($map, padding-right-mobile),
-		padding-top: map-get($map, padding-top-mobile),
-	), $mobile);
+	$mobile: map-merge(
+		(
+			padding-bottom: map-get($map, padding-bottom-mobile),
+			padding-left: map-get($map, padding-left-mobile),
+			padding-right: map-get($map, padding-right-mobile),
+			padding-top: map-get($map, padding-top-mobile),
+		),
+		$mobile
+	);
 
 	@if ($enabled) {
 		@include clay-css($base);
 
-		@if($breakpoint-down) {
+		@if ($breakpoint-down) {
 			@include media-breakpoint-down($breakpoint-down) {
 				@include clay-css($mobile);
 			}
@@ -85,9 +91,12 @@
 }
 
 @mixin clay-custom-grid-columns($map) {
-	$custom-grid-props: map-merge((
-		enabled: $enable-grid-classes
-	), $map);
+	$custom-grid-props: map-merge(
+		(
+			enabled: $enable-grid-classes,
+		),
+		$map
+	);
 
 	$enabled: map-get($custom-grid-props, enabled);
 
@@ -98,7 +107,10 @@
 		max-width: map-get(map-get($custom-grid-props, base), max-width);
 		min-width: map-get(map-get($custom-grid-props, base), min-width);
 		padding-left: map-get(map-get($custom-grid-props, base), padding-left);
-		padding-right: map-get(map-get($custom-grid-props, base), padding-right);
+		padding-right: map-get(
+			map-get($custom-grid-props, base),
+			padding-right
+		);
 		position: relative;
 		width: 100%;
 
@@ -107,13 +119,28 @@
 
 			@if ($next) {
 				@media (min-width: map-get(map-get($custom-grid-props, $next), breakpoint)) {
-					flex-basis: map-get(map-get($custom-grid-props, $next), flex-basis);
-					max-width: map-get(map-get($custom-grid-props, $next), max-width);
-					min-width: map-get(map-get($custom-grid-props, $next), min-width);
-					padding-left: map-get(map-get($custom-grid-props, $next), padding-left);
-					padding-right: map-get(map-get($custom-grid-props, $next), padding-right);
+					flex-basis: map-get(
+						map-get($custom-grid-props, $next),
+						flex-basis
+					);
+					max-width: map-get(
+						map-get($custom-grid-props, $next),
+						max-width
+					);
+					min-width: map-get(
+						map-get($custom-grid-props, $next),
+						min-width
+					);
+					padding-left: map-get(
+						map-get($custom-grid-props, $next),
+						padding-left
+					);
+					padding-right: map-get(
+						map-get($custom-grid-props, $next),
+						padding-right
+					);
 				}
 			}
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_highlight.scss b/packages/clay-css/src/scss/mixins/_highlight.scss
index fe25cfac2a..da7e1521e1 100644
--- a/packages/clay-css/src/scss/mixins/_highlight.scss
+++ b/packages/clay-css/src/scss/mixins/_highlight.scss
@@ -25,30 +25,42 @@
 @mixin clay-after-highlight-variant($map) {
 	$enabled: setter(map-get($map, enabled), true);
 
-	$base: map-merge((
-		background-color: map-get($map, bg),
-	), $map);
+	$base: map-merge(
+		(
+			background-color: map-get($map, bg),
+		),
+		$map
+	);
 
 	$hover: setter(map-get($map, hover), ());
-	$hover: map-merge((
-		background-color: map-get($map, hover-bg),
-		height: map-get($map, hover-height),
-		opacity: map-get($map, hover-opacity),
-	), $hover);
+	$hover: map-merge(
+		(
+			background-color: map-get($map, hover-bg),
+			height: map-get($map, hover-height),
+			opacity: map-get($map, hover-opacity),
+		),
+		$hover
+	);
 
 	$focus: setter(map-get($map, focus), ());
-	$focus: map-merge((
-		bg: map-get($map, focus-bg),
-		height: map-get($map, focus-height),
-		opacity: map-get($map, focus-opacity),
-	), $focus);
+	$focus: map-merge(
+		(
+			bg: map-get($map, focus-bg),
+			height: map-get($map, focus-height),
+			opacity: map-get($map, focus-opacity),
+		),
+		$focus
+	);
 
 	$active: setter(map-get($map, active), ());
-	$active: map-merge((
-		background-color: map-get($map, active-bg),
-		height: map-get($map, active-height),
-		opacity: map-get($map, active-opacity),
-	), $active);
+	$active: map-merge(
+		(
+			background-color: map-get($map, active-bg),
+			height: map-get($map, active-height),
+			opacity: map-get($map, active-opacity),
+		),
+		$active
+	);
 
 	@if ($enabled) {
 		&::after {
@@ -76,4 +88,4 @@
 			}
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_input-groups.scss b/packages/clay-css/src/scss/mixins/_input-groups.scss
index 28aed22bfc..ced0c234ed 100644
--- a/packages/clay-css/src/scss/mixins/_input-groups.scss
+++ b/packages/clay-css/src/scss/mixins/_input-groups.scss
@@ -28,22 +28,28 @@
 	$breakpoint-down: clay-breakpoint-prev($breakpoint);
 
 	$item: setter(map-get($map, item), ());
-	$item: map-merge((
-		margin-bottom: map-get($map, item-margin-bottom),
-		margin-left: map-get($map, item-margin-left),
-		margin-right: map-get($map, item-margin-right),
-		margin-top: map-get($map, item-margin-top),
-		width: setter(map-get($map, width), 100%),
-	), $item);
+	$item: map-merge(
+		(
+			margin-bottom: map-get($map, item-margin-bottom),
+			margin-left: map-get($map, item-margin-left),
+			margin-right: map-get($map, item-margin-right),
+			margin-top: map-get($map, item-margin-top),
+			width: setter(map-get($map, width), 100%),
+		),
+		$item
+	);
 
 	$item-shrink: setter(map-get($map, item-shrink), ());
-	$item-shrink: map-merge((
-		margin-bottom: map-get($map, shrink-margin-bottom),
-		margin-left: map-get($map, shrink-margin-left),
-		margin-right: map-get($map, shrink-margin-right),
-		margin-top: map-get($map, shrink-margin-top),
-		width: setter(map-get($map, width), auto),
-	), $item-shrink);
+	$item-shrink: map-merge(
+		(
+			margin-bottom: map-get($map, shrink-margin-bottom),
+			margin-left: map-get($map, shrink-margin-left),
+			margin-right: map-get($map, shrink-margin-right),
+			margin-top: map-get($map, shrink-margin-top),
+			width: setter(map-get($map, width), auto),
+		),
+		$item-shrink
+	);
 
 	@if ($enabled) {
 		@include media-breakpoint-down($breakpoint-down) {
@@ -69,9 +75,12 @@
 /// bg: {Color | String | Null}, // deprecated after 3.9.0
 
 @mixin clay-input-group-text-variant($map) {
-	$base: map-merge((
-		background-color: map-get($map, bg),
-	), $map);
+	$base: map-merge(
+		(
+			background-color: map-get($map, bg),
+		),
+		$map
+	);
 
 	@include clay-css($base);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_labels.scss b/packages/clay-css/src/scss/mixins/_labels.scss
index ebc5889c2e..b959c8f8cd 100644
--- a/packages/clay-css/src/scss/mixins/_labels.scss
+++ b/packages/clay-css/src/scss/mixins/_labels.scss
@@ -43,7 +43,10 @@
 	$item-spacer-x: map-get($map, item-spacer-x);
 	$item-spacer-y: map-get($map, item-spacer-y);
 
-	$lexicon-icon-height: setter(map-get($map, lexicon-icon-height), map-get($map, lexicon-icon-width));
+	$lexicon-icon-height: setter(
+		map-get($map, lexicon-icon-height),
+		map-get($map, lexicon-icon-width)
+	);
 	$lexicon-icon-margin-top: map-get($map, lexicon-icon-margin-top);
 	$lexicon-icon-width: map-get($map, lexicon-icon-width);
 
@@ -53,12 +56,15 @@
 	$close: setter(map-get($map, close), ());
 
 	$c-inner: setter(map-get($map, c-inner), ());
-	$c-inner: map-deep-merge((
-		margin-bottom: math-sign($padding-y),
-		margin-left: math-sign($padding-x),
-		margin-right: math-sign($padding-x),
-		margin-top: math-sign($padding-y),
-	), $c-inner);
+	$c-inner: map-deep-merge(
+		(
+			margin-bottom: math-sign($padding-y),
+			margin-left: math-sign($padding-x),
+			margin-right: math-sign($padding-x),
+			margin-top: math-sign($padding-y),
+		),
+		$c-inner
+	);
 
 	border-width: $border-width;
 	font-size: $font-size;
@@ -168,47 +174,65 @@
 /// close: {Map | Null}, // Pass parameters to `clay-close` mixin
 
 @mixin clay-label-variant($map) {
-	$map: map-merge((
-		background-color: map-get($map, bg),
-		border-color: map-get($map, border-color),
-		color: map-get($map, color),
-		outline: map-get($map, outline),
-		text-decoration: map-get($map, text-decoration),
-		transition: map-get($map, transition),
-	), $map);
-
-	$hover: map-deep-merge((
-		background-color: map-get($map, hover-bg),
-		border-color: map-get($map, hover-border-color),
-		color: map-get($map, hover-color),
-		text-decoration: map-get($map, hover-text-decoration),
-	), map-get($map, hover));
-
-	$focus: map-deep-merge((
-		background-color:  map-get($map, focus-bg),
-		border-color:  map-get($map, focus-border-color),
-		box-shadow:  map-get($map, focus-box-shadow),
-		color:  map-get($map, focus-color),
-		outline:  map-get($map, focus-outline),
-		text-decoration:  map-get($map, focus-text-decoration),
-	), map-get($map, focus));
-
-	$disabled: map-deep-merge((
-		background-color: map-get($map, disabled-bg),
-		border-color: map-get($map, disabled-border-color),
-		box-shadow: map-get($map, disabled-box-shadow),
-		color: map-get($map, disabled-color),
-	), map-get($map, disabled));
-
-	$link: map-deep-merge((
-		color: map-get($map, link-color),
-		text-decoration: map-get($map, link-text-decoration),
-	), map-get($map, link));
-
-	$link-hover: map-deep-merge((
-		color: map-get($map, link-hover-color),
-		text-decoration: map-get($map, link-hover-text-decoration),
-	), map-get($map, link-hover));
+	$map: map-merge(
+		(
+			background-color: map-get($map, bg),
+			border-color: map-get($map, border-color),
+			color: map-get($map, color),
+			outline: map-get($map, outline),
+			text-decoration: map-get($map, text-decoration),
+			transition: map-get($map, transition),
+		),
+		$map
+	);
+
+	$hover: map-deep-merge(
+		(
+			background-color: map-get($map, hover-bg),
+			border-color: map-get($map, hover-border-color),
+			color: map-get($map, hover-color),
+			text-decoration: map-get($map, hover-text-decoration),
+		),
+		map-get($map, hover)
+	);
+
+	$focus: map-deep-merge(
+		(
+			background-color: map-get($map, focus-bg),
+			border-color: map-get($map, focus-border-color),
+			box-shadow: map-get($map, focus-box-shadow),
+			color: map-get($map, focus-color),
+			outline: map-get($map, focus-outline),
+			text-decoration: map-get($map, focus-text-decoration),
+		),
+		map-get($map, focus)
+	);
+
+	$disabled: map-deep-merge(
+		(
+			background-color: map-get($map, disabled-bg),
+			border-color: map-get($map, disabled-border-color),
+			box-shadow: map-get($map, disabled-box-shadow),
+			color: map-get($map, disabled-color),
+		),
+		map-get($map, disabled)
+	);
+
+	$link: map-deep-merge(
+		(
+			color: map-get($map, link-color),
+			text-decoration: map-get($map, link-text-decoration),
+		),
+		map-get($map, link)
+	);
+
+	$link-hover: map-deep-merge(
+		(
+			color: map-get($map, link-hover-color),
+			text-decoration: map-get($map, link-hover-text-decoration),
+		),
+		map-get($map, link-hover)
+	);
 
 	$close: setter(map-get($map, close), ());
 
@@ -255,4 +279,4 @@
 	.close {
 		@include clay-close($close);
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_line-clamp.scss b/packages/clay-css/src/scss/mixins/_line-clamp.scss
index a70277b83d..f1878ea508 100644
--- a/packages/clay-css/src/scss/mixins/_line-clamp.scss
+++ b/packages/clay-css/src/scss/mixins/_line-clamp.scss
@@ -7,17 +7,21 @@
 /// @param {Number} $line-height[$line-height-base] - The element's `line-height`
 /// @param {Number} $font-size[1em] - The `font-size` of the element
 
-@mixin clay-line-clamp($lines: 3, $line-height: $line-height-base, $font-size: 1em) {
+@mixin clay-line-clamp(
+	$lines: 3,
+	$line-height: $line-height-base,
+	$font-size: 1em
+) {
 	display: block;
 	height: calc(#{$font-size} * #{$line-height} * #{$lines});
 	position: relative;
 	overflow: hidden;
 
 	@supports (-webkit-line-clamp: #{$lines}) {
-		-webkit-box-orient: vertical;  
+		-webkit-box-orient: vertical;
 		display: -webkit-box;
 		height: auto;
 		-webkit-line-clamp: $lines;
 		max-height: calc(#{$font-size} * #{$line-height} * #{$lines});
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_links.scss b/packages/clay-css/src/scss/mixins/_links.scss
index 6e760154bf..21029acfdf 100644
--- a/packages/clay-css/src/scss/mixins/_links.scss
+++ b/packages/clay-css/src/scss/mixins/_links.scss
@@ -66,90 +66,137 @@
 @mixin clay-link($map) {
 	$enabled: setter(map-get($map, enabled), true);
 
-	$base: map-merge((
-		background-color: map-get($map, bg),
-	), $map);
+	$base: map-merge(
+		(
+			background-color: map-get($map, bg),
+		),
+		$map
+	);
 
 	$hover: setter(map-get($map, hover), ());
-	$hover: map-merge((
-		background-color: map-get($map, hover-bg),
-		border-color: map-get($map, hover-border-color),
-		color: map-get($map, hover-color),
-		opacity: map-get($map, hover-opacity),
-		text-decoration: map-get($map, hover-text-decoration),
-		z-index: map-get($map, hover-z-index),
-	), $hover);
+	$hover: map-merge(
+		(
+			background-color: map-get($map, hover-bg),
+			border-color: map-get($map, hover-border-color),
+			color: map-get($map, hover-color),
+			opacity: map-get($map, hover-opacity),
+			text-decoration: map-get($map, hover-text-decoration),
+			z-index: map-get($map, hover-z-index),
+		),
+		$hover
+	);
 
 	$focus: setter(map-get($map, focus), ());
-	$focus: map-merge((
-		background-color: map-get($map, focus-bg),
-		border-color: map-get($map, focus-border-color),
-		border-radius: map-get($map, focus-border-radius),
-		box-shadow: map-get($map, focus-box-shadow),
-		color: map-get($map, focus-color),
-		opacity: map-get($map, focus-opacity),
-		outline: map-get($map, focus-outline),
-		text-decoration: map-get($map, focus-text-decoration),
-		z-index: map-get($map, focus-z-index),
-	), $focus);
+	$focus: map-merge(
+		(
+			background-color: map-get($map, focus-bg),
+			border-color: map-get($map, focus-border-color),
+			border-radius: map-get($map, focus-border-radius),
+			box-shadow: map-get($map, focus-box-shadow),
+			color: map-get($map, focus-color),
+			opacity: map-get($map, focus-opacity),
+			outline: map-get($map, focus-outline),
+			text-decoration: map-get($map, focus-text-decoration),
+			z-index: map-get($map, focus-z-index),
+		),
+		$focus
+	);
 
 	$active: setter(map-get($map, active), ());
-	$active: map-merge((
-		background-color: map-get($map, active-bg),
-		border-color: map-get($map, active-border-color),
-		color: map-get($map, active-color),
-		font-weight: map-get($map, active-font-weight),
-		z-index: map-get($map, active-z-index),
-	), $active);
+	$active: map-merge(
+		(
+			background-color: map-get($map, active-bg),
+			border-color: map-get($map, active-border-color),
+			color: map-get($map, active-color),
+			font-weight: map-get($map, active-font-weight),
+			z-index: map-get($map, active-z-index),
+		),
+		$active
+	);
 
 	$active-class: setter(map-get($map, active-class), ());
-	$active-class: map-merge((
-		background-color: setter(map-get($map, active-class-bg), map-get($map, active-bg)),
-		border-color: setter(map-get($map, active-class-border-color), map-get($map, active-border-color)),
-		color: setter(map-get($map, active-class-color), map-get($map, active-color)),
-		font-weight: setter(map-get($map, active-class-font-weight), map-get($map, active-font-weight)),
-		z-index: setter(map-get($map, active-class-z-index), map-get($map, active-z-index)),
-	), $active-class);
+	$active-class: map-merge(
+		(
+			background-color:
+				setter(map-get($map, active-class-bg), map-get($map, active-bg)),
+			border-color:
+				setter(
+					map-get($map, active-class-border-color),
+					map-get($map, active-border-color)
+				),
+			color:
+				setter(
+					map-get($map, active-class-color),
+					map-get($map, active-color)
+				),
+			font-weight:
+				setter(
+					map-get($map, active-class-font-weight),
+					map-get($map, active-font-weight)
+				),
+			z-index:
+				setter(
+					map-get($map, active-class-z-index),
+					map-get($map, active-z-index)
+				),
+		),
+		$active-class
+	);
 
 	$disabled: setter(map-get($map, disabled), ());
-	$disabled: map-merge((
-		background-color: map-get($map, disabled-bg),
-		border-color: map-get($map, disabled-border-color),
-		box-shadow: map-get($map, disabled-box-shadow),
-		color: map-get($map, disabled-color),
-		cursor: map-get($map, disabled-cursor),
-		opacity: map-get($map, disabled-opacity),
-		pointer-events: map-get($map, disabled-pointer-events),
-		text-decoration: map-get($map, disabled-text-decoration),
-	), $disabled);
+	$disabled: map-merge(
+		(
+			background-color: map-get($map, disabled-bg),
+			border-color: map-get($map, disabled-border-color),
+			box-shadow: map-get($map, disabled-box-shadow),
+			color: map-get($map, disabled-color),
+			cursor: map-get($map, disabled-cursor),
+			opacity: map-get($map, disabled-opacity),
+			pointer-events: map-get($map, disabled-pointer-events),
+			text-decoration: map-get($map, disabled-text-decoration),
+		),
+		$disabled
+	);
 
 	$disabled-active: setter(map-get($map, disabled-active), ());
-	$disabled-active: map-merge((
-		pointer-events: map-get($map, disabled-active-pointer-events),
-	), $disabled-active);
+	$disabled-active: map-merge(
+		(
+			pointer-events: map-get($map, disabled-active-pointer-events),
+		),
+		$disabled-active
+	);
 
 	$btn-focus: setter(map-get($map, btn-focus), ());
-	$btn-focus: map-merge((
-		box-shadow: map-get($map, btn-focus-box-shadow),
-		outline: map-get($map, btn-focus-outline),
-	), $btn-focus);
+	$btn-focus: map-merge(
+		(
+			box-shadow: map-get($map, btn-focus-box-shadow),
+			outline: map-get($map, btn-focus-outline),
+		),
+		$btn-focus
+	);
 
 	$lexicon-icon: setter(map-get($map, lexicon-icon), ());
-	$lexicon-icon: map-merge((
-		font-size: map-get($map, lexicon-icon-font-size),
-		margin-bottom: map-get($map, lexicon-icon-margin-bottom),
-		margin-left: map-get($map, lexicon-icon-margin-left),
-		margin-right: map-get($map, lexicon-icon-margin-right),
-		margin-top: map-get($map, lexicon-icon-margin-top),
-	), $lexicon-icon);
-
-	$c-inner: setter(map-get($map, c-inner),());
-	$c-inner: map-merge((
-		margin-bottom: math-sign(map-get($map, padding-bottom)),
-		margin-left: math-sign(map-get($map, padding-left)),
-		margin-right: math-sign(map-get($map, padding-right)),
-		margin-top: math-sign(map-get($map, padding-top)),
-	), $c-inner);
+	$lexicon-icon: map-merge(
+		(
+			font-size: map-get($map, lexicon-icon-font-size),
+			margin-bottom: map-get($map, lexicon-icon-margin-bottom),
+			margin-left: map-get($map, lexicon-icon-margin-left),
+			margin-right: map-get($map, lexicon-icon-margin-right),
+			margin-top: map-get($map, lexicon-icon-margin-top),
+		),
+		$lexicon-icon
+	);
+
+	$c-inner: setter(map-get($map, c-inner), ());
+	$c-inner: map-merge(
+		(
+			margin-bottom: math-sign(map-get($map, padding-bottom)),
+			margin-left: math-sign(map-get($map, padding-left)),
+			margin-right: math-sign(map-get($map, padding-right)),
+			margin-top: math-sign(map-get($map, padding-top)),
+		),
+		$c-inner
+	);
 
 	@if ($enabled) {
 		@include clay-css($base);
@@ -184,7 +231,7 @@
 			@include clay-css($disabled);
 
 			&:active {
-				@include clay-css($disabled-active)
+				@include clay-css($disabled-active);
 			}
 		}
 
@@ -195,7 +242,7 @@
 		}
 
 		.lexicon-icon {
-			@include clay-css($lexicon-icon)
+			@include clay-css($lexicon-icon);
 		}
 	}
 }
@@ -234,4 +281,4 @@
 
 @mixin clay-title($map) {
 	@include clay-text-typography($map);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_list-group.scss b/packages/clay-css/src/scss/mixins/_list-group.scss
index 6b7f63d8c3..2833ae1965 100644
--- a/packages/clay-css/src/scss/mixins/_list-group.scss
+++ b/packages/clay-css/src/scss/mixins/_list-group.scss
@@ -2,7 +2,7 @@
 /// @group listGroup
 ////
 
-/// A mixin for creating `.list-group-notification .list-group-item` variants. 
+/// A mixin for creating `.list-group-notification .list-group-item` variants.
 /// @param {Map} $map - A map of `key: value` pairs. The keys and value types are listed below:
 /// @example
 /// bg: {Color | String | Null}, // Default: $list-group-bg
@@ -30,15 +30,39 @@
 
 @mixin clay-list-group-notification-item-variant($map) {
 	$bg: setter(map-get($map, bg), $list-group-bg);
-	$border-bottom-color: setter(map-get($map, border-bottom-color), $list-group-notification-item-border-bottom-color);
-	$border-left-color: setter(map-get($map, border-left-color), $list-group-notification-item-border-left-color);
-	$border-right-color: setter(map-get($map, border-right-color), $list-group-notification-item-border-right-color);
-	$border-top-color: setter(map-get($map, border-top-color), $list-group-notification-item-border-top-color);
+	$border-bottom-color: setter(
+		map-get($map, border-bottom-color),
+		$list-group-notification-item-border-bottom-color
+	);
+	$border-left-color: setter(
+		map-get($map, border-left-color),
+		$list-group-notification-item-border-left-color
+	);
+	$border-right-color: setter(
+		map-get($map, border-right-color),
+		$list-group-notification-item-border-right-color
+	);
+	$border-top-color: setter(
+		map-get($map, border-top-color),
+		$list-group-notification-item-border-top-color
+	);
 
-	$border-bottom-width: setter(map-get($map, border-bottom-width), $list-group-notification-item-border-bottom-width);
-	$border-left-width: setter(map-get($map, border-left-width), $list-group-notification-item-border-left-width);
-	$border-right-width: setter(map-get($map, border-right-width), $list-group-notification-item-border-right-width);
-	$border-top-width: setter(map-get($map, border-top-width), $list-group-notification-item-border-top-width);
+	$border-bottom-width: setter(
+		map-get($map, border-bottom-width),
+		$list-group-notification-item-border-bottom-width
+	);
+	$border-left-width: setter(
+		map-get($map, border-left-width),
+		$list-group-notification-item-border-left-width
+	);
+	$border-right-width: setter(
+		map-get($map, border-right-width),
+		$list-group-notification-item-border-right-width
+	);
+	$border-top-width: setter(
+		map-get($map, border-top-width),
+		$list-group-notification-item-border-top-width
+	);
 
 	$border-bottom-left-radius: map-get($map, border-bottom-left-radius);
 	$border-bottom-right-radius: map-get($map, border-bottom-right-radius);
@@ -48,10 +72,22 @@
 	$color: map-get($map, color);
 
 	$active-bg: setter(map-get($map, active-bg), $list-group-active-bg);
-	$active-border-bottom-color: setter(map-get($map, active-border-bottom-color), $list-group-notification-item-active-border-bottom-color);
-	$active-border-left-color: setter(map-get($map, active-border-left-color), $list-group-notification-item-active-border-left-color);
-	$active-border-right-color: setter(map-get($map, active-border-right-color), $list-group-notification-item-active-border-right-color);
-	$active-border-top-color: setter(map-get($map, active-border-top-color), $list-group-notification-item-active-border-top-color);
+	$active-border-bottom-color: setter(
+		map-get($map, active-border-bottom-color),
+		$list-group-notification-item-active-border-bottom-color
+	);
+	$active-border-left-color: setter(
+		map-get($map, active-border-left-color),
+		$list-group-notification-item-active-border-left-color
+	);
+	$active-border-right-color: setter(
+		map-get($map, active-border-right-color),
+		$list-group-notification-item-active-border-right-color
+	);
+	$active-border-top-color: setter(
+		map-get($map, active-border-top-color),
+		$list-group-notification-item-active-border-top-color
+	);
 
 	// Box shadows are used for borders, determined by border variables above
 
@@ -74,11 +110,13 @@
 		border-top-right-radius: $border-top-right-radius;
 	}
 
-	box-shadow: $box-shadow-left, $box-shadow-right, $box-shadow-top, $box-shadow-bottom;
+	box-shadow: $box-shadow-left, $box-shadow-right, $box-shadow-top,
+		$box-shadow-bottom;
 	color: $color;
 
 	&.active {
 		background-color: $active-bg;
-		box-shadow: $active-box-shadow-left, $active-box-shadow-right, $active-box-shadow-top, $active-box-shadow-bottom;
+		box-shadow: $active-box-shadow-left, $active-box-shadow-right,
+			$active-box-shadow-top, $active-box-shadow-bottom;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_loaders.scss b/packages/clay-css/src/scss/mixins/_loaders.scss
index 0a5063d329..71ade702aa 100644
--- a/packages/clay-css/src/scss/mixins/_loaders.scss
+++ b/packages/clay-css/src/scss/mixins/_loaders.scss
@@ -48,25 +48,43 @@
 	);
 
 	$ball-0-scale: setter(map-get($map, ball-0-scale), 0em);
-	$ball-1-scale: setter(map-get($map, ball-1-scale), -0.10em);
+	$ball-1-scale: setter(map-get($map, ball-1-scale), -0.1em);
 	$ball-2-scale: setter(map-get($map, ball-2-scale), -0.15em);
-	$ball-3-scale: setter(map-get($map, ball-3-scale), -0.20em);
+	$ball-3-scale: setter(map-get($map, ball-3-scale), -0.2em);
 	$ball-4-scale: setter(map-get($map, ball-4-scale), -0.25em);
 	$ball-5-scale: setter(map-get($map, ball-5-scale), -0.35em);
 
 	$ball-0-alpha: setter(map-get($map, ball-0-alpha), 1);
-	$ball-1-alpha: setter(map-get($map, ball-1-alpha), 0.80);
-	$ball-2-alpha: setter(map-get($map, ball-2-alpha), 0.60);
-	$ball-3-alpha: setter(map-get($map, ball-3-alpha), 0.40);
-	$ball-4-alpha: setter(map-get($map, ball-4-alpha), 0.20);
-	$ball-5-alpha: setter(map-get($map, ball-5-alpha), 0.10);
+	$ball-1-alpha: setter(map-get($map, ball-1-alpha), 0.8);
+	$ball-2-alpha: setter(map-get($map, ball-2-alpha), 0.6);
+	$ball-3-alpha: setter(map-get($map, ball-3-alpha), 0.4);
+	$ball-4-alpha: setter(map-get($map, ball-4-alpha), 0.2);
+	$ball-5-alpha: setter(map-get($map, ball-5-alpha), 0.1);
 
-	$ball-0-color: setter(map-get($map, ball-0-color), rgba($color, $ball-0-alpha));
-	$ball-1-color: setter(map-get($map, ball-1-color), rgba($color, $ball-1-alpha));
-	$ball-2-color: setter(map-get($map, ball-2-color), rgba($color, $ball-2-alpha));
-	$ball-3-color: setter(map-get($map, ball-3-color), rgba($color, $ball-3-alpha));
-	$ball-4-color: setter(map-get($map, ball-4-color), rgba($color, $ball-4-alpha));
-	$ball-5-color: setter(map-get($map, ball-5-color), rgba($color, $ball-5-alpha));
+	$ball-0-color: setter(
+		map-get($map, ball-0-color),
+		rgba($color, $ball-0-alpha)
+	);
+	$ball-1-color: setter(
+		map-get($map, ball-1-color),
+		rgba($color, $ball-1-alpha)
+	);
+	$ball-2-color: setter(
+		map-get($map, ball-2-color),
+		rgba($color, $ball-2-alpha)
+	);
+	$ball-3-color: setter(
+		map-get($map, ball-3-color),
+		rgba($color, $ball-3-alpha)
+	);
+	$ball-4-color: setter(
+		map-get($map, ball-4-color),
+		rgba($color, $ball-4-alpha)
+	);
+	$ball-5-color: setter(
+		map-get($map, ball-5-color),
+		rgba($color, $ball-5-alpha)
+	);
 
 	@if ($enabled) {
 		&:after {
@@ -93,58 +111,57 @@
 		}
 
 		@keyframes #{$animation-name} {
-
 			// Box shadows need this specific order for proper animation
 
 			0%,
 			100% {
 				box-shadow: 0 -1em 0 $ball-0-scale $ball-0-color,
-				1em -0.5em 0 $ball-5-scale $ball-5-color,
-				1em 0.5em 0 $ball-4-scale $ball-4-color,
-				0 1em 0 $ball-3-scale $ball-3-color,
-				-1em 0.5em 0 $ball-2-scale $ball-2-color,
-				-1em -0.5em 0 $ball-1-scale $ball-1-color;
+					1em -0.5em 0 $ball-5-scale $ball-5-color,
+					1em 0.5em 0 $ball-4-scale $ball-4-color,
+					0 1em 0 $ball-3-scale $ball-3-color,
+					-1em 0.5em 0 $ball-2-scale $ball-2-color,
+					-1em -0.5em 0 $ball-1-scale $ball-1-color;
 			}
 			16.6% {
 				box-shadow: 0 -1em 0 $ball-1-scale $ball-1-color,
-				1em -0.5em 0 $ball-0-scale $ball-0-color,
-				1em 0.5em 0 $ball-5-scale $ball-5-color,
-				0 1em 0 $ball-4-scale $ball-4-color,
-				-1em 0.5em 0 $ball-3-scale $ball-3-color,
-				-1em -0.5em 0 $ball-2-scale $ball-2-color;
+					1em -0.5em 0 $ball-0-scale $ball-0-color,
+					1em 0.5em 0 $ball-5-scale $ball-5-color,
+					0 1em 0 $ball-4-scale $ball-4-color,
+					-1em 0.5em 0 $ball-3-scale $ball-3-color,
+					-1em -0.5em 0 $ball-2-scale $ball-2-color;
 			}
 			33.3% {
 				box-shadow: 0 -1em 0 $ball-2-scale $ball-2-color,
-				1em -0.5em 0 $ball-1-scale $ball-1-color,
-				1em 0.5em 0 $ball-0-scale $ball-0-color,
-				0 1em 0 $ball-5-scale $ball-5-color,
-				-1em 0.5em 0 $ball-4-scale $ball-4-color,
-				-1em -0.5em 0 $ball-3-scale $ball-3-color;
+					1em -0.5em 0 $ball-1-scale $ball-1-color,
+					1em 0.5em 0 $ball-0-scale $ball-0-color,
+					0 1em 0 $ball-5-scale $ball-5-color,
+					-1em 0.5em 0 $ball-4-scale $ball-4-color,
+					-1em -0.5em 0 $ball-3-scale $ball-3-color;
 			}
 			50% {
 				box-shadow: 0 -1em 0 $ball-3-scale $ball-3-color,
-				1em -0.5em 0 $ball-2-scale $ball-2-color,
-				1em 0.5em 0 $ball-1-scale $ball-1-color,
-				0 1em 0 $ball-0-scale $ball-0-color,
-				-1em 0.5em 0 $ball-5-scale $ball-5-color,
-				-1em -0.5em 0 $ball-4-scale $ball-4-color;
+					1em -0.5em 0 $ball-2-scale $ball-2-color,
+					1em 0.5em 0 $ball-1-scale $ball-1-color,
+					0 1em 0 $ball-0-scale $ball-0-color,
+					-1em 0.5em 0 $ball-5-scale $ball-5-color,
+					-1em -0.5em 0 $ball-4-scale $ball-4-color;
 			}
 			66.6% {
 				box-shadow: 0 -1em 0 $ball-4-scale $ball-4-color,
-				1em -0.5em 0 $ball-3-scale $ball-3-color,
-				1em 0.5em 0 $ball-2-scale $ball-2-color,
-				0 1em 0 $ball-1-scale $ball-1-color,
-				-1em 0.5em 0 $ball-0-scale $ball-0-color,
-				-1em -0.5em 0 $ball-5-scale $ball-5-color;
+					1em -0.5em 0 $ball-3-scale $ball-3-color,
+					1em 0.5em 0 $ball-2-scale $ball-2-color,
+					0 1em 0 $ball-1-scale $ball-1-color,
+					-1em 0.5em 0 $ball-0-scale $ball-0-color,
+					-1em -0.5em 0 $ball-5-scale $ball-5-color;
 			}
 			83% {
 				box-shadow: 0 -1em 0 $ball-5-scale $ball-5-color,
-				1em -0.5em 0 $ball-4-scale $ball-4-color,
-				1em 0.5em 0 $ball-3-scale $ball-3-color,
-				0 1em 0 $ball-2-scale $ball-2-color,
-				-1em 0.5em 0 $ball-1-scale $ball-1-color,
-				-1em -0.5em 0 $ball-0-scale $ball-0-color;
+					1em -0.5em 0 $ball-4-scale $ball-4-color,
+					1em 0.5em 0 $ball-3-scale $ball-3-color,
+					0 1em 0 $ball-2-scale $ball-2-color,
+					-1em 0.5em 0 $ball-1-scale $ball-1-color,
+					-1em -0.5em 0 $ball-0-scale $ball-0-color;
 			}
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_menubar.scss b/packages/clay-css/src/scss/mixins/_menubar.scss
index aabc518f4a..d6789181c7 100644
--- a/packages/clay-css/src/scss/mixins/_menubar.scss
+++ b/packages/clay-css/src/scss/mixins/_menubar.scss
@@ -55,9 +55,15 @@
 	$border-width: map-get($map, border-width);
 	$max-width: setter(map-get($map, max-width), 15.625rem); // 250px
 
-	$border-color-mobile: setter(map-get($map, border-color-mobile), transparent);
+	$border-color-mobile: setter(
+		map-get($map, border-color-mobile),
+		transparent
+	);
 	$border-style-mobile: setter(map-get($map, border-style-mobile), solid);
-	$border-width-mobile: setter(map-get($map, border-width-mobile), 0.0625rem); // 1px
+	$border-width-mobile: setter(
+		map-get($map, border-width-mobile),
+		0.0625rem
+	); // 1px
 	$margin-bottom-mobile: map-get($map, margin-bottom-mobile);
 	$margin-left-mobile: map-get($map, margin-left-mobile);
 	$margin-right-mobile: map-get($map, margin-right-mobile);
@@ -69,32 +75,68 @@
 
 	// .menubar-collapse
 
-	$collapse-border-color-mobile: setter(map-get($map, collapse-border-color-mobile), transparent);
-	$collapse-border-style-mobile: setter(map-get($map, collapse-border-style-mobile), solid);
-	$collapse-border-width-mobile: setter(map-get($map, collapse-border-width-mobile), 0.0625rem); // 1px
-	$collapse-inner-spacer-y-mobile: setter(map-get($map, collapse-inner-spacer-y-mobile), 0.5rem); // 8px
+	$collapse-border-color-mobile: setter(
+		map-get($map, collapse-border-color-mobile),
+		transparent
+	);
+	$collapse-border-style-mobile: setter(
+		map-get($map, collapse-border-style-mobile),
+		solid
+	);
+	$collapse-border-width-mobile: setter(
+		map-get($map, collapse-border-width-mobile),
+		0.0625rem
+	); // 1px
+	$collapse-inner-spacer-y-mobile: setter(
+		map-get($map, collapse-inner-spacer-y-mobile),
+		0.5rem
+	); // 8px
 	$collapse-margin-top-mobile: map-get($map, collapse-margin-top-mobile);
 	$collapse-max-width-mobile: map-get($map, collapse-max-width-mobile);
-	$collapse-left-mobile: setter(map-get($map, collapse-left-mobile), -0.0625rem); // -1px
-	$collapse-right-mobile: setter(map-get($map, collapse-right-mobile), -0.0625rem); // -1px
+	$collapse-left-mobile: setter(
+		map-get($map, collapse-left-mobile),
+		-0.0625rem
+	); // -1px
+	$collapse-right-mobile: setter(
+		map-get($map, collapse-right-mobile),
+		-0.0625rem
+	); // -1px
 	$collapse-z-index-mobile: map-get($map, collapse-z-index-mobile);
 
 	// .menubar-toggler
 
-	$toggler-border-color-mobile: setter(map-get($map, toggler-border-color-mobile), transparent);
-	$toggler-border-style-mobile: setter(map-get($map, toggler-border-style-mobile), solid);
-	$toggler-border-width-mobile: setter(map-get($map, toggler-border-width-mobile), 0.0625rem); // 1px
-	$toggler-height-mobile: setter(map-get($map, toggler-height-mobile), 2rem); // 32px
-	$toggler-padding-x-mobile: setter(map-get($map, toggler-padding-x-mobile), 0.5rem); // 8px
+	$toggler-border-color-mobile: setter(
+		map-get($map, toggler-border-color-mobile),
+		transparent
+	);
+	$toggler-border-style-mobile: setter(
+		map-get($map, toggler-border-style-mobile),
+		solid
+	);
+	$toggler-border-width-mobile: setter(
+		map-get($map, toggler-border-width-mobile),
+		0.0625rem
+	); // 1px
+	$toggler-height-mobile: setter(
+		map-get($map, toggler-height-mobile),
+		2rem
+	); // 32px
+	$toggler-padding-x-mobile: setter(
+		map-get($map, toggler-padding-x-mobile),
+		0.5rem
+	); // 8px
 	$toggler-padding-y-mobile: map-get($map, toggler-padding-y-mobile);
 
 	$toggler-c-inner: setter(map-get($map, toggler-c-inner), ());
-	$toggler-c-inner: map-deep-merge((
-		margin-bottom: math-sign($toggler-padding-y-mobile),
-		margin-left: math-sign($toggler-padding-x-mobile),
-		margin-right: math-sign($toggler-padding-x-mobile),
-		margin-top: math-sign($toggler-padding-y-mobile),
-	), $toggler-c-inner);
+	$toggler-c-inner: map-deep-merge(
+		(
+			margin-bottom: math-sign($toggler-padding-y-mobile),
+			margin-left: math-sign($toggler-padding-x-mobile),
+			margin-right: math-sign($toggler-padding-x-mobile),
+			margin-top: math-sign($toggler-padding-y-mobile),
+		),
+		$toggler-c-inner
+	);
 
 	@if ($enabled) {
 		border-color: $border-color;
@@ -174,8 +216,7 @@
 				}
 			}
 		}
-	}
-	@else {
+	} @else {
 		.menubar-collapse {
 			display: block;
 		}
@@ -280,74 +321,125 @@
 	// `$link-hover-bg` is deprecated use `$link` instead
 	$link-hover-bg: map-get($map, link-hover-bg);
 	// `$link-hover-color` is deprecated use `$link` instead
-	$link-hover-color: setter(map-get($map, link-hover-color), $navbar-light-hover-color);
+	$link-hover-color: setter(
+		map-get($map, link-hover-color),
+		$navbar-light-hover-color
+	);
 	// `$link-active-bg` is deprecated use `$link` instead
 	$link-active-bg: map-get($map, link-active-bg);
 	// `$link-active-color` is deprecated use `$link` instead
-	$link-active-color: setter(map-get($map, link-active-color), $navbar-light-active-color);
+	$link-active-color: setter(
+		map-get($map, link-active-color),
+		$navbar-light-active-color
+	);
 	// `$link-active-font-weight` is deprecated use `$link` instead
 	$link-active-font-weight: map-get($map, link-active-font-weight);
 	// `$link-disabled-bg` is deprecated use `$link` instead
 	$link-disabled-bg: map-get($map, link-disabled-bg);
 	// `$link-disabled-color` is deprecated use `$link` instead
-	$link-disabled-color: setter(map-get($map, link-disabled-color), $navbar-light-disabled-color);
+	$link-disabled-color: setter(
+		map-get($map, link-disabled-color),
+		$navbar-light-disabled-color
+	);
 
 	$link: setter(map-get($map, link), ());
-	$link: map-merge((
-		bg: $link-bg,
-		border-radius: $link-border-radius,
-		color: $link-color,
-		hover-bg: $link-hover-bg,
-		hover-color: $link-hover-color,
-		active-bg: $link-active-bg,
-		active-color: $link-active-color,
-		active-class-font-weight: $link-active-font-weight,
-		disabled-bg: $link-disabled-bg,
-		disabled-color: $link-disabled-color,
-	), $link);
+	$link: map-merge(
+		(
+			bg: $link-bg,
+			border-radius: $link-border-radius,
+			color: $link-color,
+			hover-bg: $link-hover-bg,
+			hover-color: $link-hover-color,
+			active-bg: $link-active-bg,
+			active-color: $link-active-color,
+			active-class-font-weight: $link-active-font-weight,
+			disabled-bg: $link-disabled-bg,
+			disabled-color: $link-disabled-color,
+		),
+		$link
+	);
 
 	// `$link-border-radius-mobile` is deprecated use `$link-mobile` instead
 	$link-border-radius-mobile: map-get($map, link-border-radius-mobile);
 	// `$link-color-mobile` is deprecated use `$link-mobile` instead
-	$link-color-mobile: setter(map-get($map, link-color-mobile), $dropdown-link-color);
+	$link-color-mobile: setter(
+		map-get($map, link-color-mobile),
+		$dropdown-link-color
+	);
 
 	// `$link-hover-bg-mobile` is deprecated use `$link-mobile` instead
-	$link-hover-bg-mobile: setter(map-get($map, link-hover-bg-mobile), $dropdown-link-hover-bg);
+	$link-hover-bg-mobile: setter(
+		map-get($map, link-hover-bg-mobile),
+		$dropdown-link-hover-bg
+	);
 	// `$link-hover-color-mobile` is deprecated use `$link-mobile` instead
-	$link-hover-color-mobile: setter(map-get($map, link-hover-color-mobile), $dropdown-link-hover-color);
+	$link-hover-color-mobile: setter(
+		map-get($map, link-hover-color-mobile),
+		$dropdown-link-hover-color
+	);
 
 	// `$link-active-bg-mobile` is deprecated use `$link-mobile` instead
-	$link-active-bg-mobile: setter(map-get($map, link-active-bg-mobile), $dropdown-link-active-bg);
+	$link-active-bg-mobile: setter(
+		map-get($map, link-active-bg-mobile),
+		$dropdown-link-active-bg
+	);
 	// `$link-active-font-weight-mobile` is deprecated use `$link-mobile` instead
-	$link-active-font-weight-mobile: setter(map-get($map, link-active-font-weight-mobile), $dropdown-link-active-font-weight);
+	$link-active-font-weight-mobile: setter(
+		map-get($map, link-active-font-weight-mobile),
+		$dropdown-link-active-font-weight
+	);
 	// `$link-active-color-mobile` is deprecated use `$link-mobile` instead
-	$link-active-color-mobile: setter(map-get($map, link-active-color-mobile), $dropdown-link-active-color);
+	$link-active-color-mobile: setter(
+		map-get($map, link-active-color-mobile),
+		$dropdown-link-active-color
+	);
 
 	// `$link-disabled-bg-mobile` is deprecated use `$link-mobile` instead
-	$link-disabled-bg-mobile: setter(map-get($map, link-disabled-bg-mobile), transparent);
+	$link-disabled-bg-mobile: setter(
+		map-get($map, link-disabled-bg-mobile),
+		transparent
+	);
 	// `$link-disabled-color-mobile` is deprecated use `$link-mobile` instead
-	$link-disabled-color-mobile: setter(map-get($map, link-disabled-color-mobile), $dropdown-link-disabled-color);
+	$link-disabled-color-mobile: setter(
+		map-get($map, link-disabled-color-mobile),
+		$dropdown-link-disabled-color
+	);
 
 	$link-mobile: setter(map-get($map, link-mobile), ());
-	$link-mobile: map-merge((
-		border-radius: $link-border-radius-mobile,
-		color: $link-color-mobile,
-		hover-bg: $link-hover-bg-mobile,
-		hover-color: $link-hover-color-mobile,
-		active-bg: $link-active-bg-mobile,
-		active-color: $link-active-color-mobile,
-		active-class-font-weight: $link-active-font-weight-mobile,
-		disabled-bg: $link-disabled-bg-mobile,
-		disabled-color: $link-disabled-color-mobile,
-	), $link-mobile);
+	$link-mobile: map-merge(
+		(
+			border-radius: $link-border-radius-mobile,
+			color: $link-color-mobile,
+			hover-bg: $link-hover-bg-mobile,
+			hover-color: $link-hover-color-mobile,
+			active-bg: $link-active-bg-mobile,
+			active-color: $link-active-color-mobile,
+			active-class-font-weight: $link-active-font-weight-mobile,
+			disabled-bg: $link-disabled-bg-mobile,
+			disabled-color: $link-disabled-color-mobile,
+		),
+		$link-mobile
+	);
 
 	// .menubar-collapse
 
-	$collapse-bg-mobile: setter(map-get($map, collapse-bg-mobile), $dropdown-bg);
-	$collapse-border-color-mobile: setter(map-get($map, collapse-border-color-mobile), $dropdown-border-color);
-	$collapse-border-radius-mobile: setter(map-get($map, collapse-border-radius-mobile), $border-radius);
+	$collapse-bg-mobile: setter(
+		map-get($map, collapse-bg-mobile),
+		$dropdown-bg
+	);
+	$collapse-border-color-mobile: setter(
+		map-get($map, collapse-border-color-mobile),
+		$dropdown-border-color
+	);
+	$collapse-border-radius-mobile: setter(
+		map-get($map, collapse-border-radius-mobile),
+		$border-radius
+	);
 	$collapse-border-style-mobile: map-get($map, collapse-border-style-mobile);
-	$collapse-box-shadow-mobile: setter(map-get($map, collapse-box-shadow-mobile), $dropdown-box-shadow);
+	$collapse-box-shadow-mobile: setter(
+		map-get($map, collapse-box-shadow-mobile),
+		$dropdown-box-shadow
+	);
 
 	// .menubar-toggler
 
@@ -356,20 +448,26 @@
 	// `$toggler-border-style-mobile` is deprecated use `$toggler-mobile` instead
 	$toggler-border-style-mobile: map-get($map, toggler-border-style-mobile);
 	// `$toggler-color-mobile` is deprecated use `$toggler-mobile` instead
-	$toggler-color-mobile: setter(map-get($map, toggler-color-mobile), $link-active-color);
+	$toggler-color-mobile: setter(
+		map-get($map, toggler-color-mobile),
+		$link-active-color
+	);
 	// `$toggler-font-size-mobile` is deprecated use `$toggler-mobile` instead
 	$toggler-font-size-mobile: map-get($map, toggler-font-size-mobile);
 	// `$toggler-font-weight-mobile` is deprecated use `$toggler-mobile` instead
 	$toggler-font-weight-mobile: map-get($map, toggler-font-weight-mobile);
 
 	$toggler-mobile: setter(map-get($map, toggler-mobile), ());
-	$toggler-mobile: map-merge((
-		border-color: $toggler-border-color-mobile,
-		border-style: $toggler-border-style-mobile,
-		color: $toggler-color-mobile,
-		font-size: $toggler-font-size-mobile,
-		font-weight: $toggler-font-weight-mobile,
-	), $toggler-mobile);
+	$toggler-mobile: map-merge(
+		(
+			border-color: $toggler-border-color-mobile,
+			border-style: $toggler-border-style-mobile,
+			color: $toggler-color-mobile,
+			font-size: $toggler-font-size-mobile,
+			font-weight: $toggler-font-weight-mobile,
+		),
+		$toggler-mobile
+	);
 
 	background-color: $bg;
 	border-color: $border-color;
@@ -407,4 +505,4 @@
 			@include clay-link($link-mobile);
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_modals.scss b/packages/clay-css/src/scss/mixins/_modals.scss
index 3a288f6f14..7a6129d8f4 100644
--- a/packages/clay-css/src/scss/mixins/_modals.scss
+++ b/packages/clay-css/src/scss/mixins/_modals.scss
@@ -16,7 +16,6 @@
 /// footer-bg: {Color | String | Null},
 /// footer-border-color: {Color | String | List | Null},
 
-
 @mixin clay-modal-variant($map) {
 	$header-bg: map-get($map, header-bg);
 	$header-border-color: map-get($map, header-border-color);
@@ -24,7 +23,10 @@
 
 	// header-close-color is deprecated in v2.0.0-rc.12 use header-close instead
 
-	$header-close-color: setter(map-get($map, header-close-color), $header-color);
+	$header-close-color: setter(
+		map-get($map, header-close-color),
+		$header-color
+	);
 
 	$header-close: setter(map-get($map, header-close), ());
 
@@ -66,4 +68,4 @@
 		border-color: $footer-border-color;
 		color: $footer-border-color;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_monospace.scss b/packages/clay-css/src/scss/mixins/_monospace.scss
index 1b7174e214..01544d1554 100644
--- a/packages/clay-css/src/scss/mixins/_monospace.scss
+++ b/packages/clay-css/src/scss/mixins/_monospace.scss
@@ -12,4 +12,4 @@
 	height: $size;
 	line-height: $size;
 	width: $size;
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_nav-nested.scss b/packages/clay-css/src/scss/mixins/_nav-nested.scss
index 8366565107..050231880b 100644
--- a/packages/clay-css/src/scss/mixins/_nav-nested.scss
+++ b/packages/clay-css/src/scss/mixins/_nav-nested.scss
@@ -11,7 +11,12 @@
 /// - Add @example
 /// - Add @link to documentation
 
-@mixin clay-nav-nested($indent: 15px, $nest-level: 15, $nav-class: ".nav", $i: 1) {
+@mixin clay-nav-nested(
+	$indent: 15px,
+	$nest-level: 15,
+	$nav-class: '.nav',
+	$i: 1
+) {
 	@for $i from (1) through $nest-level {
 		#{$nav-class} > li {
 			> a {
@@ -23,6 +28,6 @@
 			}
 		}
 
-		$nav-class: "#{$nav-class} .nav";
+		$nav-class: '#{$nav-class} .nav';
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_nav.scss b/packages/clay-css/src/scss/mixins/_nav.scss
index db8b6cb3bc..2bd40e16f7 100644
--- a/packages/clay-css/src/scss/mixins/_nav.scss
+++ b/packages/clay-css/src/scss/mixins/_nav.scss
@@ -35,7 +35,10 @@
 	$link-focus-bg: map-get($map, link-focus-bg);
 	$link-focus-color: map-get($map, link-focus-color);
 	$link-disabled-bg: setter(map-get($map, link-disabled-bg), transparent);
-	$link-disabled-color: setter(map-get($map, link-disabled-color), $nav-link-disabled-color);
+	$link-disabled-color: setter(
+		map-get($map, link-disabled-color),
+		$nav-link-disabled-color
+	);
 	$link-disabled-opacity: map-get($map, link-disabled-opacity);
 	$link-active-bg: map-get($map, link-active-bg);
 	$link-active-color: map-get($map, link-active-color);
@@ -76,4 +79,4 @@
 			font-weight: $link-active-font-weight;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_navbar.scss b/packages/clay-css/src/scss/mixins/_navbar.scss
index bbfc99d5b6..eb82876303 100644
--- a/packages/clay-css/src/scss/mixins/_navbar.scss
+++ b/packages/clay-css/src/scss/mixins/_navbar.scss
@@ -6,7 +6,10 @@
 	$enabled: setter(map-get($map, enabled), true);
 	$scaling-navbar: setter(map-get($map, scaling-navbar), false);
 	$container-padding-x: map-get($map, container-padding-x);
-	$container-padding-x-mobile: setter(map-get($map, container-padding-x-mobile), $container-padding-x);
+	$container-padding-x-mobile: setter(
+		map-get($map, container-padding-x-mobile),
+		$container-padding-x
+	);
 
 	$height: setter(map-get($map, height), 3.5rem);
 	$border-bottom-width: setter(map-get($map, border-bottom-width), 0);
@@ -17,24 +20,63 @@
 	$font-size: setter(map-get($map, font-size), $font-size-base);
 	$padding-x: setter(map-get($map, padding-x), $navbar-padding-x);
 	$padding-y: setter(map-get($map, padding-y), $navbar-padding-y);
-	$link-height: setter(map-get($map, link-height), $height - $border-bottom-width - $border-top-width - ($padding-y * 2));
+	$link-height: setter(
+		map-get($map, link-height),
+		$height - $border-bottom-width - $border-top-width - ($padding-y * 2)
+	);
 	$link-margin-x: map-get($map, link-margin-x);
-	$link-margin-y: setter(map-get($map, link-margin-y), (($height - $border-bottom-width - $border-top-width) - $link-height) / 2);
-	$link-padding-x: setter(map-get($map, link-padding-x), $navbar-nav-link-padding-x);
-	$link-padding-y: setter(map-get($map, link-padding-y), ($link-height - ($font-size * $line-height-base)) / 2);
+	$link-margin-y: setter(
+		map-get($map, link-margin-y),
+		(($height - $border-bottom-width - $border-top-width) - $link-height) /
+			2
+	);
+	$link-padding-x: setter(
+		map-get($map, link-padding-x),
+		$navbar-nav-link-padding-x
+	);
+	$link-padding-y: setter(
+		map-get($map, link-padding-y),
+		($link-height - ($font-size * $line-height-base)) / 2
+	);
 	$btn-font-size: setter(map-get($map, btn-font-size), $font-size);
 	$btn-monospaced-font-size: map-get($map, btn-monospaced-font-size);
 	$btn-monospaced-size: map-get($map, btn-monospaced-size);
 	$btn-margin-x: setter(map-get($map, btn-margin-x), $link-padding-x);
-	$btn-margin-y: setter(map-get($map, btn-margin-y), ($height - $border-bottom-width - $border-top-width - ($padding-y * 2) - if($btn-monospaced-size, $btn-monospaced-size, $nav-item-monospaced-size)) / 2);
+	$btn-margin-y: setter(
+		map-get($map, btn-margin-y),
+		(
+				$height - $border-bottom-width - $border-top-width -
+					($padding-y * 2) -
+					if(
+						$btn-monospaced-size,
+						$btn-monospaced-size,
+						$nav-item-monospaced-size
+					)
+			) / 2
+	);
 	$btn-padding-x: setter(map-get($map, btn-padding-x), $link-padding-x);
 	$btn-padding-y: setter(map-get($map, btn-padding-y), $link-padding-y);
 	$form-control-height: map-get($map, form-control-height);
-	$brand-font-size: setter(map-get($map, brand-font-size), $navbar-brand-font-size);
+	$brand-font-size: setter(
+		map-get($map, brand-font-size),
+		$navbar-brand-font-size
+	);
 	$brand-max-width: map-get($map, brand-max-width);
-	$brand-margin-right: setter(map-get($map, brand-margin-right), $link-padding-x);
+	$brand-margin-right: setter(
+		map-get($map, brand-margin-right),
+		$link-padding-x
+	);
 	$brand-padding-x: setter(map-get($map, brand-padding-x), $link-padding-x);
-	$brand-padding-y: setter(map-get($map, brand-padding-y), (($height - $border-bottom-width - $border-top-width - ($padding-y * 2) - ($brand-font-size * $line-height-base)) / 2));
+	$brand-padding-y: setter(
+		map-get($map, brand-padding-y),
+		(
+			(
+					$height - $border-bottom-width - $border-top-width -
+						($padding-y * 2) -
+						($brand-font-size * $line-height-base)
+				) / 2
+		)
+	);
 	$title-font-size: map-get($map, title-font-size);
 	$title-font-weight: map-get($map, title-font-weight);
 	$title-margin-bottom: map-get($map, title-margin-bottom);
@@ -43,52 +85,167 @@
 
 	$height-mobile: setter(map-get($map, height-mobile), $height);
 	$font-size-mobile: setter(map-get($map, font-size-mobile), $font-size);
-	$link-height-mobile: setter(map-get($map, link-height-mobile), $height-mobile - $border-bottom-width - $border-top-width - ($padding-y * 2));
-	$link-margin-x-mobile: setter(map-get($map, link-margin-x-mobile), $link-margin-x);
-	$link-margin-y-mobile: setter(map-get($map, link-margin-y-mobile), (($height-mobile - $border-bottom-width - $border-top-width) - $link-height-mobile) / 2);
-	$link-padding-x-mobile: setter(map-get($map, link-padding-x-mobile), $link-padding-x);
-	$link-padding-y-mobile: setter(map-get($map, link-padding-y-mobile), ($link-height-mobile - ($font-size-mobile * $line-height-base)) / 2);
-	$btn-font-size-mobile: setter(map-get($map, btn-font-size-mobile), $font-size-mobile);
-	$btn-monospaced-font-size-mobile: setter(map-get($map, btn-monospaced-font-size-mobile), $btn-monospaced-font-size);
-	$btn-monospaced-size-mobile: setter(map-get($map, btn-monospaced-size-mobile), $btn-monospaced-size);
-	$btn-margin-x-mobile: setter(map-get($map, btn-margin-x-mobile), $link-padding-x-mobile);
-	$btn-margin-y-mobile: setter(map-get($map, btn-margin-y-mobile), ($height-mobile - $border-bottom-width - $border-top-width - ($padding-y * 2) - if($btn-monospaced-size-mobile, $btn-monospaced-size-mobile, $nav-item-monospaced-size)) / 2);
-	$btn-padding-x-mobile: setter(map-get($map, btn-padding-x-mobile), $link-padding-x-mobile);
-	$btn-padding-y-mobile: setter(map-get($map, btn-padding-y-mobile), $link-padding-x-mobile);
+	$link-height-mobile: setter(
+		map-get($map, link-height-mobile),
+		$height-mobile - $border-bottom-width - $border-top-width -
+			($padding-y * 2)
+	);
+	$link-margin-x-mobile: setter(
+		map-get($map, link-margin-x-mobile),
+		$link-margin-x
+	);
+	$link-margin-y-mobile: setter(
+		map-get($map, link-margin-y-mobile),
+		(
+				($height-mobile - $border-bottom-width - $border-top-width) -
+					$link-height-mobile
+			) / 2
+	);
+	$link-padding-x-mobile: setter(
+		map-get($map, link-padding-x-mobile),
+		$link-padding-x
+	);
+	$link-padding-y-mobile: setter(
+		map-get($map, link-padding-y-mobile),
+		($link-height-mobile - ($font-size-mobile * $line-height-base)) / 2
+	);
+	$btn-font-size-mobile: setter(
+		map-get($map, btn-font-size-mobile),
+		$font-size-mobile
+	);
+	$btn-monospaced-font-size-mobile: setter(
+		map-get($map, btn-monospaced-font-size-mobile),
+		$btn-monospaced-font-size
+	);
+	$btn-monospaced-size-mobile: setter(
+		map-get($map, btn-monospaced-size-mobile),
+		$btn-monospaced-size
+	);
+	$btn-margin-x-mobile: setter(
+		map-get($map, btn-margin-x-mobile),
+		$link-padding-x-mobile
+	);
+	$btn-margin-y-mobile: setter(
+		map-get($map, btn-margin-y-mobile),
+		(
+				$height-mobile - $border-bottom-width - $border-top-width -
+					($padding-y * 2) -
+					if(
+						$btn-monospaced-size-mobile,
+						$btn-monospaced-size-mobile,
+						$nav-item-monospaced-size
+					)
+			) / 2
+	);
+	$btn-padding-x-mobile: setter(
+		map-get($map, btn-padding-x-mobile),
+		$link-padding-x-mobile
+	);
+	$btn-padding-y-mobile: setter(
+		map-get($map, btn-padding-y-mobile),
+		$link-padding-x-mobile
+	);
 	$form-control-height-mobile: map-get($map, form-control-height-mobile);
-	$brand-font-size-mobile: setter(map-get($map, brand-font-size-mobile), $font-size-lg-mobile);
-	$brand-margin-right-mobile: setter(map-get($map, brand-margin-right-mobile), 0);
-	$brand-padding-x-mobile: setter(map-get($map, brand-padding-x-mobile), $link-padding-x-mobile);
-	$brand-padding-y-mobile: setter(map-get($map, brand-padding-y-mobile), (($height-mobile - $border-bottom-width - $border-top-width - ($padding-y * 2) - ($brand-font-size-mobile * $line-height-base)) / 2));
-	$collapse-dropdown-item-padding-x-mobile: map-get($map, collapse-dropdown-item-padding-x-mobile);
-	$collapse-dropdown-item-padding-y-mobile: map-get($map, collapse-dropdown-item-padding-y-mobile);
-
-	$toggler-font-size: setter(map-get($map, toggler-font-size), $navbar-toggler-font-size);
-	$toggler-height: setter(map-get($map, toggler-height), $height-mobile * 0.66667);
-	$toggler-margin-x: setter(map-get($map, toggler-margin-x), $link-padding-x-mobile);
+	$brand-font-size-mobile: setter(
+		map-get($map, brand-font-size-mobile),
+		$font-size-lg-mobile
+	);
+	$brand-margin-right-mobile: setter(
+		map-get($map, brand-margin-right-mobile),
+		0
+	);
+	$brand-padding-x-mobile: setter(
+		map-get($map, brand-padding-x-mobile),
+		$link-padding-x-mobile
+	);
+	$brand-padding-y-mobile: setter(
+		map-get($map, brand-padding-y-mobile),
+		(
+			(
+					$height-mobile - $border-bottom-width - $border-top-width -
+						($padding-y * 2) -
+						($brand-font-size-mobile * $line-height-base)
+				) / 2
+		)
+	);
+	$collapse-dropdown-item-padding-x-mobile: map-get(
+		$map,
+		collapse-dropdown-item-padding-x-mobile
+	);
+	$collapse-dropdown-item-padding-y-mobile: map-get(
+		$map,
+		collapse-dropdown-item-padding-y-mobile
+	);
+
+	$toggler-font-size: setter(
+		map-get($map, toggler-font-size),
+		$navbar-toggler-font-size
+	);
+	$toggler-height: setter(
+		map-get($map, toggler-height),
+		$height-mobile * 0.66667
+	);
+	$toggler-margin-x: setter(
+		map-get($map, toggler-margin-x),
+		$link-padding-x-mobile
+	);
 	$toggler-margin-y: map-get($map, toggler-margin-y);
-	$toggler-padding-x: setter(map-get($map, toggler-padding-x), $navbar-toggler-padding-x);
-	$toggler-padding-y: setter(map-get($map, toggler-padding-y), $navbar-toggler-padding-y);
-
-	$toggler-link-font-size: setter(map-get($map, toggler-link-font-size), $font-size-mobile);
+	$toggler-padding-x: setter(
+		map-get($map, toggler-padding-x),
+		$navbar-toggler-padding-x
+	);
+	$toggler-padding-y: setter(
+		map-get($map, toggler-padding-y),
+		$navbar-toggler-padding-y
+	);
+
+	$toggler-link-font-size: setter(
+		map-get($map, toggler-link-font-size),
+		$font-size-mobile
+	);
 	$toggler-link-height: setter(map-get($map, toggler-link-height), auto);
-	$toggler-link-line-height: setter(map-get($map, toggler-link-line-height), $line-height-base);
+	$toggler-link-line-height: setter(
+		map-get($map, toggler-link-line-height),
+		$line-height-base
+	);
 	$toggler-link-margin-x: setter(map-get($map, toggler-link-margin-x), 0);
 	$toggler-link-margin-y: map-get($map, toggler-link-margin-y);
-	$toggler-link-padding-x: setter(map-get($map, toggler-link-padding-x), $link-padding-x-mobile);
-	$toggler-link-padding-y: setter(map-get($map, toggler-link-padding-y), ($height-mobile - $border-bottom-width - $border-top-width - ($padding-y * 2) - ($toggler-link-font-size * $toggler-link-line-height)) / 2);
-
-	$active-border-bottom-width: setter(map-get($map, active-border-bottom-width), 0.125rem);
+	$toggler-link-padding-x: setter(
+		map-get($map, toggler-link-padding-x),
+		$link-padding-x-mobile
+	);
+	$toggler-link-padding-y: setter(
+		map-get($map, toggler-link-padding-y),
+		(
+				$height-mobile - $border-bottom-width - $border-top-width -
+					($padding-y * 2) -
+					($toggler-link-font-size * $toggler-link-line-height)
+			) / 2
+	);
+
+	$active-border-bottom-width: setter(
+		map-get($map, active-border-bottom-width),
+		0.125rem
+	);
 	$active-border-offset-x: map-get($map, active-border-offset-x);
-	$active-border-offset-bottom: setter(map-get($map, active-border-offset-bottom), -$border-bottom-width - $padding-y - $link-margin-y);
+	$active-border-offset-bottom: setter(
+		map-get($map, active-border-offset-bottom),
+		-$border-bottom-width - $padding-y - $link-margin-y
+	);
 	$active-border-offset-top: map-get($map, active-border-offset-top);
 
-	$active-border-offset-bottom-mobile: setter(map-get($map, active-border-offset-bottom-mobile), -$border-bottom-width - $padding-y - $link-margin-y-mobile);
+	$active-border-offset-bottom-mobile: setter(
+		map-get($map, active-border-offset-bottom-mobile),
+		-$border-bottom-width - $padding-y - $link-margin-y-mobile
+	);
 
 	@if ($enabled) {
 		@include border-radius($navbar-border-radius);
 
-		border-width: $border-top-width $border-right-width $border-bottom-width $border-left-width;
+		border-width: $border-top-width
+			$border-right-width
+			$border-bottom-width
+			$border-left-width;
 
 		@include box-shadow($box-shadow);
 
@@ -263,14 +420,17 @@
 				$next: breakpoint-next($breakpoint, $grid-breakpoints);
 				$infix: breakpoint-infix($next, $grid-breakpoints);
 
-				&#{$infix} { // .navbar-expand, sm, md, lg, xl
-					@if not ($infix == '') { // .navbar-expand-sm, md, lg, xl
+				&#{$infix} {
+					// .navbar-expand, sm, md, lg, xl
+					@if not($infix == '') {
+						// .navbar-expand-sm, md, lg, xl
 						@include media-breakpoint-down($breakpoint) {
 							&.navbar-collapse-absolute {
 								.navbar-collapse {
 									border-color: transparent;
 									border-style: solid;
-									border-width: 0 $border-right-width $border-bottom-width $border-left-width;
+									border-width: 0 $border-right-width
+										$border-bottom-width $border-left-width;
 
 									@include box-shadow($box-shadow);
 
@@ -301,7 +461,8 @@
 							}
 
 							.navbar-form {
-								height: $height-mobile - $border-bottom-width - $border-top-width;
+								height: $height-mobile - $border-bottom-width -
+									$border-top-width;
 								padding-bottom: $link-padding-y-mobile;
 								padding-left: $link-padding-x-mobile;
 								padding-right: $link-padding-x-mobile;
@@ -336,9 +497,15 @@
 
 								@if ($enable-c-inner) {
 									.c-inner {
-										margin-bottom: math-sign($brand-padding-y);
-										margin-left: math-sign($brand-padding-x);
-										margin-right: math-sign($brand-padding-x);
+										margin-bottom: math-sign(
+											$brand-padding-y
+										);
+										margin-left: math-sign(
+											$brand-padding-x
+										);
+										margin-right: math-sign(
+											$brand-padding-x
+										);
 										margin-top: math-sign($brand-padding-y);
 									}
 								}
@@ -347,7 +514,9 @@
 
 						.navbar-form {
 							@if ($scaling-navbar) {
-								height: $height - $border-bottom-width - $border-top-width;
+								height: $height -
+									$border-bottom-width -
+									$border-top-width;
 								padding-left: $link-padding-x;
 								padding-right: $link-padding-x;
 
@@ -379,7 +548,9 @@
 
 								@if ($enable-c-inner) {
 									.c-inner {
-										margin-bottom: math-sign($btn-padding-y);
+										margin-bottom: math-sign(
+											$btn-padding-y
+										);
 										margin-left: math-sign($btn-padding-x);
 										margin-right: math-sign($btn-padding-x);
 										margin-top: math-sign($btn-padding-y);
@@ -425,9 +596,13 @@
 
 								@if ($enable-c-inner) {
 									.c-inner {
-										margin-bottom: math-sign($link-padding-y);
+										margin-bottom: math-sign(
+											$link-padding-y
+										);
 										margin-left: math-sign($link-padding-x);
-										margin-right: math-sign($link-padding-x);
+										margin-right: math-sign(
+											$link-padding-x
+										);
 										margin-top: math-sign($link-padding-y);
 									}
 								}
@@ -499,7 +674,8 @@
 				$next: breakpoint-next($breakpoint, $grid-breakpoints);
 				$infix: breakpoint-infix($next, $grid-breakpoints);
 
-				&#{$infix} { // .navbar-expand, sm, md, lg, xl
+				&#{$infix} {
+					// .navbar-expand, sm, md, lg, xl
 					@include media-breakpoint-up($next) {
 						.navbar-nav .nav-link {
 							&.active:after {
@@ -551,7 +727,10 @@
 	$brand-bg: map-get($map, brand-bg);
 	$brand-hover-bg: map-get($map, brand-hover-bg);
 	$toggler-color: setter(map-get($map, toggler-color), $link-color);
-	$toggler-font-weight: setter(map-get($map, toggler-font-weight), $link-font-weight);
+	$toggler-font-weight: setter(
+		map-get($map, toggler-font-weight),
+		$link-font-weight
+	);
 	$underline-active-bg: map-get($map, underline-active-bg);
 
 	@if ($enabled) {
@@ -583,7 +762,7 @@
 			}
 
 			&.active,
-			&[aria-expanded="true"] {
+			&[aria-expanded='true'] {
 				background-color: $link-active-bg;
 				color: $link-active-color;
 			}
@@ -635,7 +814,7 @@
 		}
 
 		.navbar-toggler-link {
-			&[aria-expanded="true"] {
+			&[aria-expanded='true'] {
 				color: $link-active-color;
 			}
 		}
@@ -649,8 +828,10 @@
 				$next: breakpoint-next($breakpoint, $grid-breakpoints);
 				$infix: breakpoint-infix($next, $grid-breakpoints);
 
-				&#{$infix} { // .navbar-expand, sm, md, lg, xl
-					@if not ($infix == '') { // .navbar-expand-sm, md, lg, xl
+				&#{$infix} {
+					// .navbar-expand, sm, md, lg, xl
+					@if not($infix == '') {
+						// .navbar-expand-sm, md, lg, xl
 						@include media-breakpoint-down($breakpoint) {
 							&.navbar-collapse-absolute .navbar-collapse {
 								background-color: $bg;
@@ -696,4 +877,4 @@
 
 		@content;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_panels.scss b/packages/clay-css/src/scss/mixins/_panels.scss
index 7990e83f38..1e985bcd84 100644
--- a/packages/clay-css/src/scss/mixins/_panels.scss
+++ b/packages/clay-css/src/scss/mixins/_panels.scss
@@ -75,7 +75,10 @@
 	$header-padding-top: map-get($map, header-padding-top);
 	$header-transition: map-get($map, header-transition);
 
-	$header-collapsed-border-color: map-get($map, header-collapsed-border-color);
+	$header-collapsed-border-color: map-get(
+		$map,
+		header-collapsed-border-color
+	);
 
 	$header-link: setter(map-get($map, header-link), ());
 
@@ -189,7 +192,8 @@
 	@at-root {
 		.panel-group.panel-group-flush & {
 			.panel-header-link {
-				&, &.collapsed {
+				&,
+				&.collapsed {
 					border-radius: map-get($header-link, border-radius);
 				}
 			}
@@ -197,4 +201,4 @@
 	}
 
 	@content;
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_position.scss b/packages/clay-css/src/scss/mixins/_position.scss
index a7abf606d1..5fb3a8d827 100644
--- a/packages/clay-css/src/scss/mixins/_position.scss
+++ b/packages/clay-css/src/scss/mixins/_position.scss
@@ -6,7 +6,7 @@
 // @param $rule-flag - specify a CSS flag for your rule e.g. !important
 
 @mixin clay-position($point: top-left, $position: absolute, $rule-flag: '') {
-	@if not ($rule-flag == '') {
+	@if not($rule-flag == '') {
 		$rule-flag: ' #{$rule-flag}';
 	}
 
@@ -17,57 +17,49 @@
 		left: 50%#{$rule-flag};
 		right: auto#{$rule-flag};
 		top: 0#{$rule-flag};
-		transform: translateX(-50%)#{$rule-flag};
-	}
-	@else if ($point == top-right) {
+		transform: translateX(-50%) #{$rule-flag};
+	} @else if ($point == top-right) {
 		bottom: auto#{$rule-flag};
 		left: auto#{$rule-flag};
 		right: 0#{$rule-flag};
 		top: 0#{$rule-flag};
-	}
-	@else if ($point == right-middle) {
+	} @else if ($point == right-middle) {
 		bottom: auto#{$rule-flag};
 		left: auto#{$rule-flag};
 		right: 0#{$rule-flag};
 		top: 50%#{$rule-flag};
-		transform: translateY(-50%)#{$rule-flag};
-	}
-	@else if ($point == bottom-right) {
+		transform: translateY(-50%) #{$rule-flag};
+	} @else if ($point == bottom-right) {
 		bottom: 0#{$rule-flag};
 		left: auto#{$rule-flag};
 		right: 0#{$rule-flag};
 		top: auto#{$rule-flag};
-	}
-	@else if ($point == bottom-center) {
+	} @else if ($point == bottom-center) {
 		bottom: 0#{$rule-flag};
 		left: 50%#{$rule-flag};
 		right: auto#{$rule-flag};
-		transform: translateX(-50%)#{$rule-flag};
-	}
-	@else if ($point == bottom-left) {
+		transform: translateX(-50%) #{$rule-flag};
+	} @else if ($point == bottom-left) {
 		bottom: 0#{$rule-flag};
 		left: 0#{$rule-flag};
 		right: auto#{$rule-flag};
 		top: auto#{$rule-flag};
-	}
-	@else if ($point == left-middle) {
+	} @else if ($point == left-middle) {
 		bottom: auto#{$rule-flag};
 		left: 0#{$rule-flag};
 		right: auto#{$rule-flag};
 		top: 50%#{$rule-flag};
-		transform: translateY(-50%)#{$rule-flag};
-	}
-	@else if ($point == center-middle) {
+		transform: translateY(-50%) #{$rule-flag};
+	} @else if ($point == center-middle) {
 		bottom: auto#{$rule-flag};
 		left: 50%#{$rule-flag};
 		right: auto#{$rule-flag};
 		top: 50%#{$rule-flag};
-		transform: translate(-50%, -50%)#{$rule-flag};
-	}
-	@else {
+		transform: translate(-50%, -50%) #{$rule-flag};
+	} @else {
 		bottom: auto#{$rule-flag};
 		left: 0#{$rule-flag};
 		right: auto#{$rule-flag};
 		top: 0#{$rule-flag};
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_scale-component.scss b/packages/clay-css/src/scss/mixins/_scale-component.scss
index 655b70024f..ab19ecc40e 100644
--- a/packages/clay-css/src/scss/mixins/_scale-component.scss
+++ b/packages/clay-css/src/scss/mixins/_scale-component.scss
@@ -8,7 +8,7 @@
 @mixin clay-scale-component($scale: $enable-scaling-components) {
 	@if ($scale) {
 		@include media-breakpoint-down($scaling-breakpoint-down) {
-			@content
+			@content;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_sheet.scss b/packages/clay-css/src/scss/mixins/_sheet.scss
index dec5869943..f48c2928ae 100644
--- a/packages/clay-css/src/scss/mixins/_sheet.scss
+++ b/packages/clay-css/src/scss/mixins/_sheet.scss
@@ -39,4 +39,4 @@
 			}
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_sidebar.scss b/packages/clay-css/src/scss/mixins/_sidebar.scss
index 10db125d57..1084bab8e5 100644
--- a/packages/clay-css/src/scss/mixins/_sidebar.scss
+++ b/packages/clay-css/src/scss/mixins/_sidebar.scss
@@ -40,22 +40,28 @@
 	$box-shadow: map-get($map, box-shadow);
 	$color: map-get($map, color);
 
-	$sidebar: map-merge((
-		background-color: $bg,
-		border-color: $border-color,
-		border-bottom-width: $border-bottom-width,
-		border-left-width: $border-left-width,
-		border-right-width: $border-right-width,
-		border-top-width: $border-top-width,
-		box-shadow: $box-shadow,
-		color: $color,
-	), $map);
+	$sidebar: map-merge(
+		(
+			background-color: $bg,
+			border-color: $border-color,
+			border-bottom-width: $border-bottom-width,
+			border-left-width: $border-left-width,
+			border-right-width: $border-right-width,
+			border-top-width: $border-top-width,
+			box-shadow: $box-shadow,
+			color: $color,
+		),
+		$map
+	);
 
 	$panel-bg: map-get($map, panel-bg);
 
-	$panel: map-deep-merge((
-		background-color: $panel-bg,
-	), map-get($map, panel));
+	$panel: map-deep-merge(
+		(
+			background-color: $panel-bg,
+		),
+		map-get($map, panel)
+	);
 
 	$header: map-deep-merge((), map-get($map, header));
 
@@ -64,7 +70,10 @@
 	$footer: map-deep-merge((), map-get($map, footer));
 
 	$component-header-title: setter(map-get($map, component-header-title), ());
-	$component-header-subtitle: setter(map-get($map, component-header-subtitle), ());
+	$component-header-subtitle: setter(
+		map-get($map, component-header-subtitle),
+		()
+	);
 	$component-link: setter(map-get($map, component-link), ());
 
 	$close: map-deep-merge((), map-get($map, close));
@@ -77,21 +86,45 @@
 	$dd: setter(map-get($map, dd), ());
 
 	$sidebar-list-group-item-bg: map-get($map, sidebar-list-group-item-bg);
-	$sidebar-list-group-item-border-color: map-get($map, sidebar-list-group-item-border-color);
-
-	$sidebar-list-group-item: map-deep-merge((
-		background-color: $sidebar-list-group-item-bg,
-		border-color: $sidebar-list-group-item-border-color,
-	), map-get($map, sidebar-list-group-item));
-
-	$sidebar-list-group-title: setter(map-get($map, sidebar-list-group-title), ());
-	$sidebar-list-group-subtitle: setter(map-get($map, sidebar-list-group-subtitle), ());
-	$sidebar-list-group-text: setter(map-get($map, sidebar-list-group-text), ());
-	$sidebar-list-group-subtext: setter(map-get($map, sidebar-list-group-subtext), ());
-
-	$sidebar-list-group-sticker: map-deep-merge((), map-get($map, sidebar-list-group-sticker));
-
-	$sidebar-list-group-sticker-secondary: map-deep-merge((), map-get($map, sidebar-list-group-sticker-secondary));
+	$sidebar-list-group-item-border-color: map-get(
+		$map,
+		sidebar-list-group-item-border-color
+	);
+
+	$sidebar-list-group-item: map-deep-merge(
+		(
+			background-color: $sidebar-list-group-item-bg,
+			border-color: $sidebar-list-group-item-border-color,
+		),
+		map-get($map, sidebar-list-group-item)
+	);
+
+	$sidebar-list-group-title: setter(
+		map-get($map, sidebar-list-group-title),
+		()
+	);
+	$sidebar-list-group-subtitle: setter(
+		map-get($map, sidebar-list-group-subtitle),
+		()
+	);
+	$sidebar-list-group-text: setter(
+		map-get($map, sidebar-list-group-text),
+		()
+	);
+	$sidebar-list-group-subtext: setter(
+		map-get($map, sidebar-list-group-subtext),
+		()
+	);
+
+	$sidebar-list-group-sticker: map-deep-merge(
+		(),
+		map-get($map, sidebar-list-group-sticker)
+	);
+
+	$sidebar-list-group-sticker-secondary: map-deep-merge(
+		(),
+		map-get($map, sidebar-list-group-sticker-secondary)
+	);
 
 	$panel-unstyled: setter(map-get($map, panel-unstyled), ());
 
diff --git a/packages/clay-css/src/scss/mixins/_slideout.scss b/packages/clay-css/src/scss/mixins/_slideout.scss
index 1ae2855860..1ae83ff9fd 100644
--- a/packages/clay-css/src/scss/mixins/_slideout.scss
+++ b/packages/clay-css/src/scss/mixins/_slideout.scss
@@ -18,91 +18,51 @@
 
 @mixin clay-slideout-variant($map) {
 	@if (setter(map-get($map, enabled), true)) {
-		@include clay-css(
-			setter(
-				$map,
-				()
-			)
-		);
+		@include clay-css(setter($map, ()));
 
 		&.c-slideout-shown {
-			@include clay-css(
-				setter(
-					map-get($map, c-slideout-shown),
-					()
-				)
-			);
+			@include clay-css(setter(map-get($map, c-slideout-shown), ()));
 		}
 
 		&.c-slideout-tbar-shown {
-			@include clay-css(
-				setter(
-					map-get($map, c-slideout-tbar-shown),
-					()
-				)
-			);
+			@include clay-css(setter(map-get($map, c-slideout-tbar-shown), ()));
 		}
 
 		&.c-slideout-tbar-shown .sidebar {
 			@include clay-css(
-				setter(
-					map-get($map, c-slideout-tbar-shown-sidebar),
-					()
-				)
+				setter(map-get($map, c-slideout-tbar-shown-sidebar), ())
 			);
 		}
 
 		.sidebar {
-			@include clay-css(
-				setter(
-					map-get($map, sidebar),
-					()
-				)
-			);
+			@include clay-css(setter(map-get($map, sidebar), ()));
 		}
 
 		.sidebar.c-slideout-show {
 			@include clay-css(
-				setter(
-					map-get($map, sidebar-c-slideout-show),
-					()
-				)
+				setter(map-get($map, sidebar-c-slideout-show), ())
 			);
 		}
 
 		.sidebar.c-slideout-transition {
 			@include clay-css(
-				setter(
-					map-get($map, sidebar-c-slideout-transition),
-					()
-				)
+				setter(map-get($map, sidebar-c-slideout-transition), ())
 			);
 		}
 
 		.tbar-stacked {
-			@include clay-css(
-				setter(
-					map-get($map, tbar-stacked),
-					()
-				)
-			);
+			@include clay-css(setter(map-get($map, tbar-stacked), ()));
 		}
 
 		.tbar-stacked.c-slideout-show {
 			@include clay-css(
-				setter(
-					map-get($map, tbar-stacked-c-slideout-show),
-					()
-				)
+				setter(map-get($map, tbar-stacked-c-slideout-show), ())
 			);
 		}
 
 		.tbar-stacked.c-slideout-transition {
 			@include clay-css(
-				setter(
-					map-get($map, tbar-stacked-c-slideout-transition),
-					()
-				)
+				setter(map-get($map, tbar-stacked-c-slideout-transition), ())
 			);
 		}
 	}
diff --git a/packages/clay-css/src/scss/mixins/_stickers.scss b/packages/clay-css/src/scss/mixins/_stickers.scss
index 2783163c5a..bee6fde454 100644
--- a/packages/clay-css/src/scss/mixins/_stickers.scss
+++ b/packages/clay-css/src/scss/mixins/_stickers.scss
@@ -16,7 +16,10 @@
 @mixin clay-sticker-size($map) {
 	$font-size: map-get($map, font-size);
 	$inline-item-font-size: map-get($map, inline-item-font-size);
-	$outside-offset: setter(map-get($map, outside-offset), -(map-get($map, size) / 2));
+	$outside-offset: setter(
+		map-get($map, outside-offset),
+		-(map-get($map, size) / 2)
+	);
 	$size: map-get($map, size);
 
 	font-size: $font-size;
@@ -119,4 +122,4 @@
 	.sticker-overlay {
 		border-radius: $border-radius;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_tbar.scss b/packages/clay-css/src/scss/mixins/_tbar.scss
index 91cc2d174d..8f4333317f 100644
--- a/packages/clay-css/src/scss/mixins/_tbar.scss
+++ b/packages/clay-css/src/scss/mixins/_tbar.scss
@@ -75,26 +75,32 @@
 	// `$padding-y` is deprecated use `$map` instead
 	$padding-y: map-get($map, padding-y);
 
-	$tbar: map-merge((
-		border-color: $border-color,
-		border-style: $border-style,
-		border-width: $border-width,
-		background-color: setter($bg-color, map-get($map, background-color)),
-		color: $color,
-		font-size: $font-size,
-		height: $height,
-		padding-bottom: $padding-y,
-		padding-left: $padding-x,
-		padding-right: $padding-x,
-		padding-top: $padding-y,
-	), $map);
+	$tbar: map-merge(
+		(
+			border-color: $border-color,
+			border-style: $border-style,
+			border-width: $border-width,
+			background-color: setter($bg-color, map-get($map, background-color)),
+			color: $color,
+			font-size: $font-size,
+			height: $height,
+			padding-bottom: $padding-y,
+			padding-left: $padding-x,
+			padding-right: $padding-x,
+			padding-top: $padding-y,
+		),
+		$map
+	);
 
 	// `$strong-font-weight` is deprecated use `$strong` instead
 	$strong-font-weight: map-get($map, strong-font-weight);
 
-	$strong: map-deep-merge((
-		font-weight: $strong-font-weight,
-	), map-get($map, strong));
+	$strong: map-deep-merge(
+		(
+			font-weight: $strong-font-weight,
+		),
+		map-get($map, strong)
+	);
 
 	$nav: setter(map-get($map, nav), ());
 
@@ -105,13 +111,16 @@
 	// `$item-padding-y` is deprecated use `$item` instead
 	$item-padding-y: map-get($map, item-padding-y);
 
-	$item: map-deep-merge((
-		justify-content: $item-justify-content,
-		padding-bottom: $item-padding-y,
-		padding-left: $item-padding-x,
-		padding-right: $item-padding-x,
-		padding-top: $item-padding-y,
-	), map-get($map, item));
+	$item: map-deep-merge(
+		(
+			justify-content: $item-justify-content,
+			padding-bottom: $item-padding-y,
+			padding-left: $item-padding-x,
+			padding-right: $item-padding-x,
+			padding-top: $item-padding-y,
+		),
+		map-get($map, item)
+	);
 
 	$item-expand: setter(map-get($map, item-expand), ());
 
@@ -136,20 +145,23 @@
 	// `$btn-padding-y` is deprecated use `$btn` instead
 	$btn-padding-y: map-get($map, btn-padding-y);
 
-	$btn: map-deep-merge((
-		height: $btn-height,
-		font-size: $btn-font-size,
-		font-weight: $btn-font-weight,
-		line-height: $btn-line-height,
-		margin-bottom: $btn-margin-y,
-		margin-left: $btn-margin-x,
-		margin-right: $btn-margin-x,
-		margin-top: $btn-margin-y,
-		padding-bottom: $btn-padding-y,
-		padding-left: $btn-padding-x,
-		padding-right: $btn-padding-x,
-		padding-top: $btn-padding-y,
-	), map-get($map, btn));
+	$btn: map-deep-merge(
+		(
+			height: $btn-height,
+			font-size: $btn-font-size,
+			font-weight: $btn-font-weight,
+			line-height: $btn-line-height,
+			margin-bottom: $btn-margin-y,
+			margin-left: $btn-margin-x,
+			margin-right: $btn-margin-x,
+			margin-top: $btn-margin-y,
+			padding-bottom: $btn-padding-y,
+			padding-left: $btn-padding-x,
+			padding-right: $btn-padding-x,
+			padding-top: $btn-padding-y,
+		),
+		map-get($map, btn)
+	);
 
 	// `$btn-monospaced-border-radius` is deprecated use `$btn-monospaced` instead
 	$btn-monospaced-border-radius: map-get($map, btn-monospaced-border-radius);
@@ -164,23 +176,29 @@
 	// `$btn-monospaced-padding` is deprecated use `$btn-monospaced` instead
 	$btn-monospaced-padding: map-get($map, btn-monospaced-padding);
 	// `$btn-monospaced-size` is deprecated use `$btn-monospaced` instead
-	$btn-monospaced-size: setter(map-get($map, btn-monospaced-size), $btn-height);
-
-	$btn-monospaced: map-deep-merge((
-		border-radius: $btn-monospaced-border-radius,
-		border-width: $btn-monospaced-border-width,
-		font-size: $btn-monospaced-font-size,
-		height: $btn-monospaced-size,
-		margin-bottom: $btn-monospaced-margin-y,
-		margin-left: $btn-monospaced-margin-x,
-		margin-right: $btn-monospaced-margin-x,
-		margin-top: $btn-monospaced-margin-y,
-		padding-bottom: $btn-monospaced-padding-y,
-		padding-left: $btn-monospaced-padding-x,
-		padding-right: $btn-monospaced-padding-x,
-		padding-top: $btn-monospaced-padding-y,
-		width: $btn-monospaced-size,
-	), map-get($map, btn-monospaced));
+	$btn-monospaced-size: setter(
+		map-get($map, btn-monospaced-size),
+		$btn-height
+	);
+
+	$btn-monospaced: map-deep-merge(
+		(
+			border-radius: $btn-monospaced-border-radius,
+			border-width: $btn-monospaced-border-width,
+			font-size: $btn-monospaced-font-size,
+			height: $btn-monospaced-size,
+			margin-bottom: $btn-monospaced-margin-y,
+			margin-left: $btn-monospaced-margin-x,
+			margin-right: $btn-monospaced-margin-x,
+			margin-top: $btn-monospaced-margin-y,
+			padding-bottom: $btn-monospaced-padding-y,
+			padding-left: $btn-monospaced-padding-x,
+			padding-right: $btn-monospaced-padding-x,
+			padding-top: $btn-monospaced-padding-y,
+			width: $btn-monospaced-size,
+		),
+		map-get($map, btn-monospaced)
+	);
 
 	// `$link-margin-x` is deprecated use `$link` instead
 	$link-margin-x: map-get($map, link-margin-x);
@@ -191,19 +209,25 @@
 	// `$link-padding-y` is deprecated use `$link` instead
 	$link-padding-y: map-get($map, link-padding-y);
 
-	$link: map-deep-merge((
-		margin-bottom: $link-margin-y,
-		margin-left: $link-margin-x,
-		margin-right: $link-margin-x,
-		margin-top: $link-margin-y,
-		padding-bottom: $link-padding-y,
-		padding-left: $link-padding-x,
-		padding-right: $link-padding-x,
-		padding-top: $link-padding-y,
-	), map-get($map, link));
+	$link: map-deep-merge(
+		(
+			margin-bottom: $link-margin-y,
+			margin-left: $link-margin-x,
+			margin-right: $link-margin-x,
+			margin-top: $link-margin-y,
+			padding-bottom: $link-padding-y,
+			padding-left: $link-padding-x,
+			padding-right: $link-padding-x,
+			padding-top: $link-padding-y,
+		),
+		map-get($map, link)
+	);
 
 	// `$link-monospaced-border-radius` is deprecated use `$link-monospaced` instead
-	$link-monospaced-border-radius: map-get($map, link-monospaced-border-radius);
+	$link-monospaced-border-radius: map-get(
+		$map,
+		link-monospaced-border-radius
+	);
 	// `$link-monospaced-border-width` is deprecated use `$link-monospaced` instead
 	$link-monospaced-border-width: map-get($map, link-monospaced-border-width);
 	// `$link-monospaced-font-size` is deprecated use `$link-monospaced` instead
@@ -217,25 +241,31 @@
 	// `$link-monospaced-size` is deprecated use `$link-monospaced` instead
 	$link-monospaced-size: map-get($map, link-monospaced-size);
 
-	$link-monospaced: map-deep-merge((
-		border-radius: $link-monospaced-border-radius,
-		border-width: $link-monospaced-border-width,
-		font-size: $link-monospaced-font-size,
-		height: $link-monospaced-size,
-		margin-bottom: $link-monospaced-margin-y,
-		margin-left: $link-monospaced-margin-x,
-		margin-right: $link-monospaced-margin-x,
-		margin-top: $link-monospaced-margin-y,
-		padding: $link-monospaced-padding,
-		width: $link-monospaced-size,
-	), map-get($map, link-monospaced));
+	$link-monospaced: map-deep-merge(
+		(
+			border-radius: $link-monospaced-border-radius,
+			border-width: $link-monospaced-border-width,
+			font-size: $link-monospaced-font-size,
+			height: $link-monospaced-size,
+			margin-bottom: $link-monospaced-margin-y,
+			margin-left: $link-monospaced-margin-x,
+			margin-right: $link-monospaced-margin-x,
+			margin-top: $link-monospaced-margin-y,
+			padding: $link-monospaced-padding,
+			width: $link-monospaced-size,
+		),
+		map-get($map, link-monospaced)
+	);
 
 	// `$section-text-align` is deprecated use `$section` instead
 	$section-text-align: map-get($map, section-text-align);
 
-	$section: map-deep-merge((
-		text-align: $section-text-align,
-	), map-get($map, section));
+	$section: map-deep-merge(
+		(
+			text-align: $section-text-align,
+		),
+		map-get($map, section)
+	);
 
 	$component-action: setter(map-get($map, component-action), ());
 
@@ -395,4 +425,4 @@
 			}
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_timelines.scss b/packages/clay-css/src/scss/mixins/_timelines.scss
index 0a880815f7..aab59b7525 100644
--- a/packages/clay-css/src/scss/mixins/_timelines.scss
+++ b/packages/clay-css/src/scss/mixins/_timelines.scss
@@ -30,14 +30,18 @@
 	}
 }
 
-/// A mixin that helps with spacing in a `.timeline`. 
-/// @param {Number} $outer-spacing - Sets `padding-left` or `padding-right` on `.timeline` relative to where the increments are positioned. 
+/// A mixin that helps with spacing in a `.timeline`.
+/// @param {Number} $outer-spacing - Sets `padding-left` or `padding-right` on `.timeline` relative to where the increments are positioned.
 /// @param {Number} $inner-spacing - Sets `padding-left` on `.timeline-item` if the `.panel` is positioned on the right and `padding-right` if `.panel` is positioned on the left.
 /// @param {Number} $item-padding-y[10px] - Sets `padding-top` and `padding-bottom` on `.timeline-item`.
 /// @todo
 /// - Add @link to documentation
 
-@mixin clay-timeline-spacing($outer-spacing, $inner-spacing, $item-padding-y: 10px) {
+@mixin clay-timeline-spacing(
+	$outer-spacing,
+	$inner-spacing,
+	$item-padding-y: 10px
+) {
 	&.timeline {
 		padding-left: $outer-spacing;
 	}
@@ -121,4 +125,4 @@
 			left: -($inner-spacing - $timeline-border-modifier);
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_toggle-switch.scss b/packages/clay-css/src/scss/mixins/_toggle-switch.scss
index 516e64aec2..efcdb6b0e5 100644
--- a/packages/clay-css/src/scss/mixins/_toggle-switch.scss
+++ b/packages/clay-css/src/scss/mixins/_toggle-switch.scss
@@ -7,10 +7,15 @@
 /// @param {Number} $toggle-switch-padding - Space between button and bar
 /// @param {Number} $label-spacer-x[8px] - Space between toggle-switch-bar and data-label
 
-@function clay-data-label-text-position($toggle-switch-width, $toggle-switch-padding, $label-spacer-x: 8px) {
+@function clay-data-label-text-position(
+	$toggle-switch-width,
+	$toggle-switch-padding,
+	$label-spacer-x: 8px
+) {
 	@if ($toggle-switch-padding < 0) {
-		$toggle-switch-width: $toggle-switch-width + abs($toggle-switch-padding);
+		$toggle-switch-width: $toggle-switch-width +
+			abs($toggle-switch-padding);
 	}
 
 	@return $toggle-switch-width + $label-spacer-x;
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_type.scss b/packages/clay-css/src/scss/mixins/_type.scss
index 698fe42bde..ad248b2454 100644
--- a/packages/clay-css/src/scss/mixins/_type.scss
+++ b/packages/clay-css/src/scss/mixins/_type.scss
@@ -2,7 +2,10 @@
 // @param $bg-color - Color of the highlight
 // @param $color - Colors the text
 
-@mixin clay-highlight-text($bg-color: theme-color-level(warning, -10), $color: $body-color) {
+@mixin clay-highlight-text(
+	$bg-color: theme-color-level(warning, -10),
+	$color: $body-color
+) {
 	background-color: $bg-color;
 	box-decoration-break: clone;
 	box-shadow: -0.25em 0 0 $bg-color;
@@ -24,4 +27,4 @@
 		width: 0.25em;
 		z-index: -1;
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/mixins/_utilities.scss b/packages/clay-css/src/scss/mixins/_utilities.scss
index 642819c216..17134ed75a 100644
--- a/packages/clay-css/src/scss/mixins/_utilities.scss
+++ b/packages/clay-css/src/scss/mixins/_utilities.scss
@@ -66,4 +66,4 @@
 			padding-top: $autofit-col-padding-top;
 		}
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/site/_site.scss b/packages/clay-css/src/scss/site/_site.scss
index a44447d9a6..5a785e6541 100644
--- a/packages/clay-css/src/scss/site/_site.scss
+++ b/packages/clay-css/src/scss/site/_site.scss
@@ -30,11 +30,12 @@ section.row {
 }
 
 #headerTopBar {
-	background: #0058BA url(../../content/site-images/back_decoration_nav.png) no-repeat 100% 0;
+	background: #0058ba url(../../content/site-images/back_decoration_nav.png)
+		no-repeat 100% 0;
 	position: relative;
 
 	a {
-		color: #FFF;
+		color: #fff;
 		margin-right: 8px;
 		vertical-align: middle;
 
@@ -130,7 +131,7 @@ section.row {
 }
 
 .docs-icon-bar {
-	background-color: #FFF;
+	background-color: #fff;
 	display: block;
 	height: 2px;
 	margin-left: auto;
@@ -190,18 +191,38 @@ section.row {
 
 // Breakpoints
 
-.clay-site-breakpoint-min-xs { content: '#{map-get($grid-breakpoints, xs)}'; }
-.clay-site-breakpoint-min-sm { content: '#{map-get($grid-breakpoints, sm)}'; }
-.clay-site-breakpoint-min-md { content: '#{map-get($grid-breakpoints, md)}'; }
-.clay-site-breakpoint-min-lg { content: '#{map-get($grid-breakpoints, lg)}'; }
-.clay-site-breakpoint-min-xl { content: '#{map-get($grid-breakpoints, xl)}'; }
+.clay-site-breakpoint-min-xs {
+	content: '#{map-get($grid-breakpoints, xs)}';
+}
+.clay-site-breakpoint-min-sm {
+	content: '#{map-get($grid-breakpoints, sm)}';
+}
+.clay-site-breakpoint-min-md {
+	content: '#{map-get($grid-breakpoints, md)}';
+}
+.clay-site-breakpoint-min-lg {
+	content: '#{map-get($grid-breakpoints, lg)}';
+}
+.clay-site-breakpoint-min-xl {
+	content: '#{map-get($grid-breakpoints, xl)}';
+}
 
-.clay-site-breakpoint-max-xs { content: '#{map-get($grid-breakpoints, sm) - 1}'; }
-.clay-site-breakpoint-max-sm { content: '#{map-get($grid-breakpoints, md) - 1}'; }
-.clay-site-breakpoint-max-md { content: '#{map-get($grid-breakpoints, lg) - 1}'; }
-.clay-site-breakpoint-max-lg { content: '#{map-get($grid-breakpoints, xl) - 1}'; }
+.clay-site-breakpoint-max-xs {
+	content: '#{map-get($grid-breakpoints, sm) - 1}';
+}
+.clay-site-breakpoint-max-sm {
+	content: '#{map-get($grid-breakpoints, md) - 1}';
+}
+.clay-site-breakpoint-max-md {
+	content: '#{map-get($grid-breakpoints, lg) - 1}';
+}
+.clay-site-breakpoint-max-lg {
+	content: '#{map-get($grid-breakpoints, xl) - 1}';
+}
 
-.clay-site-inline-scroller-height { content: '#{$inline-scroller-max-height}'; }
+.clay-site-inline-scroller-height {
+	content: '#{$inline-scroller-max-height}';
+}
 
 // Colors Page
 
@@ -227,11 +248,11 @@ section.row {
 
 .clay-site-swatch-text {
 	&::-moz-selection {
-		background-color: #FFF;
+		background-color: #fff;
 	}
 
 	&::selection {
-		background-color: #FFF;
+		background-color: #fff;
 	}
 }
 
@@ -1164,8 +1185,9 @@ section.row {
 // Cards Page
 
 .clay-site-vertical-card {
-	.card-header, .card-footer {
-		background: #EEE;
+	.card-header,
+	.card-footer {
+		background: #eee;
 		padding-bottom: 5px;
 		padding-top: 5px;
 	}
@@ -1261,7 +1283,7 @@ section.row {
 		}
 	}
 
-	[data-container-classes="container-fluid container-fluid-max-#{$breakpoint} main-nav-container"] {
+	[data-container-classes='container-fluid container-fluid-max-#{$breakpoint} main-nav-container'] {
 		&:after {
 			content: ' (#{$value})';
 		}
@@ -1274,12 +1296,22 @@ section.row {
 
 // Modals Page
 
-.clay-site-modal-size-sm { content: '#{$modal-sm}'; }
-.clay-site-modal-size-md { content: '#{$modal-md}'; }
-.clay-site-modal-size-lg { content: '#{$modal-lg}'; }
-.clay-site-modal-size-xl { content: '#{$modal-xl}'; }
+.clay-site-modal-size-sm {
+	content: '#{$modal-sm}';
+}
+.clay-site-modal-size-md {
+	content: '#{$modal-md}';
+}
+.clay-site-modal-size-lg {
+	content: '#{$modal-lg}';
+}
+.clay-site-modal-size-xl {
+	content: '#{$modal-xl}';
+}
 
-.clay-site-modal-full-screen-spacer-x { content: '#{$modal-full-screen-spacer-x}'; }
+.clay-site-modal-full-screen-spacer-x {
+	content: '#{$modal-full-screen-spacer-x}';
+}
 
 // Navbars Page
 
@@ -1303,11 +1335,11 @@ section.row {
 
 	.lexicon-icon-asterisk {
 		fill-opacity: 0;
-		stroke: #078DD8;
+		stroke: #078dd8;
 		stroke-width: 10px;
 
 		&:hover {
-			fill: #078DD8;
+			fill: #078dd8;
 			fill-opacity: 1;
 			stroke: #000;
 			stroke-opacity: 0.3;
@@ -1316,9 +1348,9 @@ section.row {
 	}
 
 	.lexicon-icon-logout {
-		fill: #DA3A35;
+		fill: #da3a35;
 		fill-opacity: 1;
-		stroke: #FFF;
+		stroke: #fff;
 		stroke-width: 55px;
 
 		&:hover {
@@ -1345,20 +1377,21 @@ section.row {
 	}
 
 	.lexicon-icon-exclamation-full {
-		fill: #E3A200;
-		stroke: #FFF;
+		fill: #e3a200;
+		stroke: #fff;
 		stroke-opacity: 0.4;
 		stroke-width: 40px;
 
 		&:hover {
-			animation: exclamationHover 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+			animation: exclamationHover 0.25s
+				cubic-bezier(0.175, 0.885, 0.32, 1.275);
 			animation-fill-mode: both;
-			fill: #EC297B;
+			fill: #ec297b;
 		}
 	}
 }
 
-$site-lexicon-icon-color: #5AF;
+$site-lexicon-icon-color: #5af;
 
 .site-svg-bg {
 	background-repeat: no-repeat;
@@ -1402,7 +1435,9 @@ $site-lexicon-icon-color: #5AF;
 }
 
 .site-linux-tux {
-	background-image: clay-svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://web.resource.org/cc/" width="500pt" height="600pt"><defs><linearGradient id="linearGradient172"><stop style="stop-color:#3f2600;stop-opacity:0.6;" offset="0" id="stop173"/><stop style="stop-color:#3f2600;stop-opacity:0;" offset="1" id="stop174"/></linearGradient><linearGradient id="linearGradient167"><stop style="stop-color:#ffffff;stop-opacity:0.65;" offset="0" id="stop168"/><stop style="stop-color:#ffffff;stop-opacity:0;" offset="1" id="stop169"/></linearGradient><linearGradient id="linearGradient162"><stop style="stop-color:#ffa63f;stop-opacity:1;" offset="0" id="stop163"/><stop style="stop-color:#ffff00;stop-opacity:1;" offset="1" id="stop164"/></linearGradient><linearGradient id="linearGradient153"><stop style="stop-color:#ffeed7;stop-opacity:1;" offset="0" id="stop154"/><stop style="stop-color:#bdbfc2;stop-opacity:1;" offset="1" id="stop155"/></linearGradient><linearGradient id="linearGradient138"><stop style="stop-color:#ffffff;stop-opacity:0.8;" offset="0" id="stop139"/><stop style="stop-color:#ffffff;stop-opacity:0;" offset="1" id="stop140"/></linearGradient><linearGradient xlink:href="#linearGradient138" id="linearGradient141" x1="0.47424799" y1="0.020191999" x2="0.417539" y2="0.90125799" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient142" x1="0.55880702" y1="0.031192999" x2="0.553922" y2="0.94531101" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient143" x1="0.46557701" y1="0.028819799" x2="0.41365999" y2="0.93366498" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient144" x1="0.70346397" y1="0.059404202" x2="0.64553201" y2="0.94063401" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient145" x1="0.46741399" y1="-0.036155298" x2="0.86741799" y2="0.75857902" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient146" x1="0.57152498" y1="0.023441499" x2="0.57143003" y2="0.71875" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient147" x1="0.5" y1="0.0234362" x2="0.5" y2="0.8125" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient148" x1="0.50799799" y1="0.37435901" x2="0.51599997" y2="0.92820501" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient138" id="linearGradient149" x1="0.5" y1="0.131707" x2="0.50400001" y2="0.94634098" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient150" x1="-0.30509499" y1="0.099496603" x2="0.156323" y2="0.94191301" gradientUnits="objectBoundingBox" gradientTransform="matrix(-0.928523,0.283938,0.435332,0.943857,-1.91327e-7,5.49908e-8)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient151" x1="0.433979" y1="0.022184599" x2="0.487055" y2="1.02569" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient152" x1="0.5" y1="0.89842999" x2="0.5" y2="0.40625" gradientUnits="objectBoundingBox" spreadMethod="reflect"/><linearGradient xlink:href="#linearGradient153" id="linearGradient156" x1="0.43568701" y1="0.98882002" x2="0.453989" y2="0.23093501" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient157" x1="0.49180499" y1="1.15284" x2="0.49482101" y2="0.41252401" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient158" x1="0.51730198" y1="0.85418499" x2="0.49843901" y2="0.136172" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient159" x1="0.46201" y1="0.87917101" x2="0.49215299" y2="0.096282303" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient161" x1="0.50086302" y1="0.34872901" x2="0.41209599" y2="0.98558098" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient165" x1="0.60399801" y1="0.51020199" x2="0.46399999" y2="0.98367399" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient166" x1="0.50000501" y1="0.191616" x2="0.50800002" y2="0.97005898" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient171" cx="0.5" cy="0.5" fx="0.5" fy="0.5" r="0.5" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient176"/><linearGradient xlink:href="#linearGradient153" id="linearGradient178" x1="0.94027299" y1="1.2934099" x2="0.19452" y2="-0.675295" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient1399" gradientTransform="scale(1.045233,0.956725)" cx="446.77762" cy="1219.4125" fx="446.77762" fy="1219.4125" r="195.07191" gradientUnits="userSpaceOnUse"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1401" gradientUnits="userSpaceOnUse" x1="400.57785" y1="369.53015" x2="400.84448" y2="304.07886" gradientTransform="scale(0.575262,1.738339)"/><linearGradient xlink:href="#linearGradient138" id="linearGradient1403" gradientUnits="userSpaceOnUse" x1="303.01761" y1="237.93179" x2="297.0856" y2="330.09561" gradientTransform="scale(1.116071,0.896001)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1405" gradientUnits="userSpaceOnUse" gradientTransform="scale(0.816497,1.224744)" x1="378.93771" y1="278.60202" x2="380.27319" y2="243.91606"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1407" gradientUnits="userSpaceOnUse" x1="381.38742" y1="277.495" x2="380.5517" y2="245.68338" gradientTransform="scale(0.816497,1.224744)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1409" gradientUnits="userSpaceOnUse" gradientTransform="scale(0.816497,1.224744)" x1="379.09573" y1="240.92712" x2="376.79556" y2="281.01636"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1411" gradientUnits="userSpaceOnUse" x1="389.63535" y1="242.28218" x2="387.06866" y2="281.32513" gradientTransform="scale(0.816497,1.224744)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1413" gradientUnits="userSpaceOnUse" spreadMethod="reflect" x1="437.57941" y1="528.87177" x2="437.57941" y2="394.10361" gradientTransform="scale(0.812855,1.230232)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1415" gradientUnits="userSpaceOnUse" x1="375.17325" y1="419.78485" x2="377.48541" y2="324.03815" gradientTransform="scale(0.649784,1.538974)"/><linearGradient xlink:href="#linearGradient138" id="linearGradient1417" gradientUnits="userSpaceOnUse" x1="320.75104" y1="498.17776" x2="321.32224" y2="614.50439" gradientTransform="scale(1.074798,0.930408)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1419" gradientUnits="userSpaceOnUse" x1="322.48257" y1="435.26761" x2="323.2514" y2="488.48251" gradientTransform="scale(1.077001,0.928504)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1421" gradientUnits="userSpaceOnUse" x1="411.2215" y1="242.94365" x2="411.2215" y2="331.44858" gradientTransform="scale(0.571707,1.749147)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1423" gradientUnits="userSpaceOnUse" x1="867.34546" y1="234.73897" x2="867.33453" y2="314.83911" gradientTransform="scale(0.572667,1.746214)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1425" gradientUnits="userSpaceOnUse" x1="236.25362" y1="657.11133" x2="212.5099" y2="737.41229" gradientTransform="scale(1.011514,0.988617)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1427" gradientUnits="userSpaceOnUse" x1="381.56607" y1="655.73102" x2="279.64313" y2="386.66583" gradientTransform="scale(1.065499,0.938527)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1429" gradientUnits="userSpaceOnUse" x1="218.11714" y1="630.30475" x2="203.12654" y2="737.8537" gradientTransform="scale(1.009851,0.990245)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1431" gradientUnits="userSpaceOnUse" gradientTransform="scale(1.007724,0.992335)" x1="117.88966" y1="587.23602" x2="182.24524" y2="704.73077"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1433" gradientUnits="userSpaceOnUse" x1="223.10072" y1="570.41809" x2="230.53499" y2="710.97723" gradientTransform="scale(0.999504,1.000496)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1435" gradientUnits="userSpaceOnUse" x1="316.93988" y1="474.01779" x2="371.60889" y2="582.63507" gradientTransform="scale(1.065499,0.938527)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1437" gradientUnits="userSpaceOnUse" x1="284.68652" y1="410.46326" x2="285.45923" y2="485.69934" gradientTransform="scale(1.218684,0.820557)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1439" gradientUnits="userSpaceOnUse" x1="288.82358" y1="398.85422" x2="288.37628" y2="482.55939" gradientTransform="scale(1.221941,0.81837)"/></defs><g id="g1369" transform="translate(-310.7524,-64.25268)"><path transform="matrix(1.4177,0,0,0.414745,-38.7944,222.194)" d="M 670.88202 1166.6423 A 203.89551 186.63016 0 1 1 263.091,1166.6423 A 203.89551 186.63016 0 1 1 670.88202 1166.6423 z" id="path175" style="fill:url(#radialGradient1399);stroke:none;stroke-width:1pt;stroke-linecap:butt;stroke-linejoin:miter"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path106" d="M 223.627,632.24 C 201.239,600.017 196.873,495.256 249.114,430.81 C 275,399.892 281.604,378.345 283.645,349.417 C 285.034,316.438 260.32,217.975 353.528,210.473 C 447.934,202.941 442.864,296.133 442.321,345.448 C 441.87,387.088 472.895,410.689 494.117,443.143 C 533.396,502.773 530.074,605.443 486.718,661.015 C 431.801,730.583 384.765,700.413 353.528,702.945 C 295.035,706.147 293.101,737.336 223.627,632.24 z " style="fill:#000000;stroke:none;stroke-width:1.25;"/><path transform="matrix(-1.67739,-2.24516e-2,-2.11236e-2,1.4709,1173.58,-293.017)" id="path113" d="M 246.571,470.864 C 234.332,483.36 202.175,539.956 251.44,576.224 C 268.809,588.857 235.063,635.719 219.435,612.532 C 191.865,570.914 210.604,505.591 227.75,482.344 C 239.402,465.857 256.98,459.668 246.571,470.864 z " style="fill:url(#linearGradient1401);stroke:none;stroke-width:0.99464899;"/><path transform="matrix(-1.67755,0,0,1.52374,1174.62,-318.082)" id="path111" d="M 256.513,459.837 C 236.598,477.554 200.337,539.928 253.225,580.443 C 270.595,593.075 237.832,632.906 219.435,612.532 C 155.472,541.712 221.104,460.278 243.697,432.282 C 263.889,407.935 281.775,438.034 256.513,459.837 z " style="fill:#000000;stroke:#000000;stroke-width:0.97729802;"/><path transform="matrix(1.26626,-7.13667e-2,-4.59795e-2,1.19574,202.143,-125.761)" d="M 399.56879 258.15753 A 58.37323 46.863022 0 1 1 282.82233,258.15753 A 58.37323 46.863022 0 1 1 399.56879 258.15753 z" id="path114" style="fill:url(#linearGradient1403);stroke:none;stroke-width:1.26498997;"/><path transform="matrix(1.30445,-7.55326e-2,7.71251e-2,1.34257,144.757,-177.617)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path115" style="fill:url(#linearGradient1405);stroke:none;stroke-width:1.17873001;"/><path transform="matrix(-1.81082,4.95107e-2,3.17324e-2,1.55333,1207.46,-284.777)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path116" style="fill:url(#linearGradient1407);stroke:none;stroke-width:0.93138498;"/><path transform="matrix(-0.823196,-1.76123e-3,-1.82321e-2,0.852662,913.674,-37.9902)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path117" style="fill:#000000;stroke:none;stroke-width:1.86495996;"/><path transform="matrix(0.59438,-7.22959e-2,6.88176e-2,0.705838,367.448,32.4186)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path118" style="fill:#000000;stroke:none;stroke-width:2.39814997;"/><path transform="matrix(-0.480323,-3.6454e-2,-4.67935e-2,0.475606,813.496,87.0124)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path121" style="fill:url(#linearGradient1409);stroke:none;stroke-width:3.1916101;"/><path transform="matrix(0.35691,-4.08211e-2,4.13232e-2,0.398544,449.334,114.991)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path122" style="fill:url(#linearGradient1411);stroke:none;stroke-width:4.12025976;"/><path transform="matrix(1.25,0,0,1.25,185.454,-168.23)" id="path128" d="M 258.702,495.425 C 271.538,466.322 298.816,415.199 299.397,375.667 C 299.397,344.225 393.576,336.716 401.134,368.109 C 408.692,399.502 427.875,446.592 440.084,469.265 C 452.292,491.937 487.893,563.96 449.968,626.811 C 415.811,682.455 312.243,726.477 256.958,619.254 C 238.355,582.047 241.673,535.939 258.702,495.425 z " style="fill:url(#linearGradient1413);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.38936,-0.111074,0.102211,1.30214,108.413,-165.938)" id="path112" d="M 242.905,473.815 C 231.642,492.782 207.405,543.124 255.042,575.862 C 306.353,610.682 301.515,672.924 239.435,637.817 C 182.658,606.028 216.59,500.039 234.925,475.551 C 247.032,458.337 264.822,437.52 242.905,473.815 z " style="fill:url(#linearGradient1415);stroke:none;stroke-width:1.15804005;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path109" d="M 256.513,449.72 C 239.048,478.228 197.136,545.533 253.225,580.443 C 328.794,626.798 307.398,673.154 238.426,631.417 C 141.317,573.153 226.601,455.801 265.557,411.079 C 310.001,360.879 274.111,420.166 256.513,449.72 z " style="fill:#000000;stroke:#000000;stroke-width:1.25;"/><path id="path125" d="M 421.481,504.727 C 421.481,537.139 392.209,579.243 341.953,578.865 C 290.125,579.32 268.004,537.139 268.004,504.727 C 268.004,472.315 302.383,446.01 344.743,446.01 C 387.102,446.01 421.481,472.315 421.481,504.727 z " style="font-size:12px;fill:url(#linearGradient1417);stroke:none;stroke-width:1.23705006;stroke-dasharray:none" transform="matrix(1.30209,0,0,1.22525,170.042,-153.557)"/><path id="path127" d="M 398.227,412.292 C 397.615,450.864 375.047,459.963 346.487,459.963 C 317.926,459.963 297.195,454.269 294.746,412.292 C 294.746,385.978 317.926,370.75 346.487,370.75 C 375.047,370.75 398.227,385.978 398.227,412.292 z " style="font-size:12px;fill:url(#linearGradient1419);stroke:none;stroke-width:1.38846004;stroke-dasharray:none" transform="matrix(1.1868,0,0,1.06708,210.623,-100.078)"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path129" d="M 234.285,456.475 C 252.001,429.479 289.3,388.111 241.262,462.288 C 202.311,523.331 226.859,562.561 239.518,573.327 C 276.045,605.889 274.484,627.676 245.913,610.533 C 184.288,573.907 197.078,512.285 234.285,456.475 z " style="fill:url(#linearGradient1421);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path131" d="M 490.662,467.52 C 475.343,435.819 426.528,355.618 492.988,448.917 C 553.449,533.214 511.01,591.93 503.452,597.744 C 495.895,603.557 470.315,615.184 477.873,594.837 C 485.43,574.49 523.107,535.864 490.662,467.52 z " style="fill:url(#linearGradient1423);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path132" d="M 220.915,716.921 C 180.473,695.505 121.663,721.045 143.013,662.855 C 147.289,649.617 136.638,629.847 143.594,616.929 C 151.733,601.231 169.174,604.72 179.639,594.255 C 189.957,583.364 196.498,564.606 215.683,567.513 C 234.867,570.42 247.628,593.974 261.027,622.742 C 270.91,643.38 305.968,672.406 303.677,695.5 C 300.981,731 260.65,737.69 220.915,716.921 z " style="fill:url(#linearGradient1425);stroke:#e68c3f;stroke-width:6.25;"/><path id="path177" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:url(#linearGradient1427);stroke:none;stroke-width:2.85509992;stroke-dasharray:none" transform="matrix(0.598206,0.268584,-0.239623,0.617213,700.568,140.464)"/><path transform="matrix(-1.1685,0.423145,0.475283,1.16478,728.343,-213.821)" id="path133" d="M 220.274,718.402 C 178.947,694.812 120.38,724.007 143.013,662.855 C 147.749,649.787 136.417,629.303 143.373,616.385 C 151.512,600.687 169.174,604.72 179.639,594.255 C 189.957,583.364 198.466,566.387 217.651,569.294 C 236.835,572.201 247.628,593.974 261.027,622.742 C 270.91,643.38 304.442,671.713 302.151,694.807 C 299.455,730.307 259.427,740.278 220.274,718.402 z " style="fill:url(#linearGradient1429);stroke:#e68c3f;stroke-width:6.25067997;"/><path transform="matrix(-0.945096,0.343745,0.424076,0.956058,714.328,-64.342)" id="path134" d="M 216.482,675.68 C 129.951,618.177 169.174,604.72 179.639,594.255 C 189.957,583.364 198.466,566.387 217.651,569.294 C 236.835,572.201 247.628,593.974 261.027,622.742 C 270.91,643.38 304.087,671.66 302.151,694.807 C 299.535,721.917 253.961,700.294 216.482,675.68 z " style="fill:url(#linearGradient1431);stroke:none;stroke-width:1.52532005;"/><path transform="matrix(1.00431,-5.2286e-2,-1.74e-2,1.04575,244.191,-28.4653)" id="path135" d="M 216.506,677.071 C 129.975,619.568 169.709,603.501 182.56,595.791 C 197.959,585.849 197.718,564.96 216.903,567.867 C 236.087,570.774 247.628,593.974 261.027,622.742 C 270.91,643.38 304.087,671.66 302.151,694.807 C 299.535,721.917 253.985,701.685 216.506,677.071 z " style="fill:url(#linearGradient1433);stroke:none;stroke-width:1.52532005;"/><path id="path136" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:#000000;stroke:none;stroke-width:2.85509992;" transform="matrix(0.515584,0.215259,-0.206526,0.49467,713.3,222.559)"/><path id="path137" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:url(#linearGradient1435);stroke:none;stroke-width:2.85509992;" transform="matrix(0.351231,0.149463,-0.128856,0.343469,724.522,318.291)"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path119" d="M 309.954,338.729 C 317.101,331.959 334.765,311.663 367.915,332.974 C 374.077,336.984 379.077,337.351 390.936,342.429 C 414.662,352.178 403.318,375.688 378.192,383.537 C 367.434,387.026 357.656,400.093 338.063,398.976 C 321.329,397.999 316.944,387.102 306.665,381.07 C 288.396,370.759 285.7,356.816 295.565,349.417 C 305.431,342.018 309.29,339.358 309.954,338.729 z " style="fill:url(#linearGradient1437);stroke:#e68c3f;stroke-width:3.75;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path120" d="M 391.251,357.645 C 381.368,358.226 359.858,379.736 337.185,379.736 C 314.512,379.736 301.141,358.807 297.653,358.807" style="fill:none;stroke:#e68c3f;stroke-width:2.5;"/><path transform="matrix(0.627885,0,0,0.595666,392.366,51.8173)" id="path123" d="M 309.954,338.729 C 317.101,331.959 339.645,313.381 369.542,332.401 C 375.841,336.167 382.346,340.266 392.02,345.865 C 411.182,357.613 401.691,374.543 378.734,385.255 C 368.316,389.75 351.141,399.67 338.063,398.976 C 323.53,397.568 314.128,387.577 304.496,381.07 C 286.826,368.767 287.899,358.833 296.107,350.562 C 302.312,344.883 309.29,339.358 309.954,338.729 z " style="fill:url(#linearGradient1439);stroke:none;"/></g></svg>');
+	background-image: clay-svg-url(
+		'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://web.resource.org/cc/" width="500pt" height="600pt"><defs><linearGradient id="linearGradient172"><stop style="stop-color:#3f2600;stop-opacity:0.6;" offset="0" id="stop173"/><stop style="stop-color:#3f2600;stop-opacity:0;" offset="1" id="stop174"/></linearGradient><linearGradient id="linearGradient167"><stop style="stop-color:#ffffff;stop-opacity:0.65;" offset="0" id="stop168"/><stop style="stop-color:#ffffff;stop-opacity:0;" offset="1" id="stop169"/></linearGradient><linearGradient id="linearGradient162"><stop style="stop-color:#ffa63f;stop-opacity:1;" offset="0" id="stop163"/><stop style="stop-color:#ffff00;stop-opacity:1;" offset="1" id="stop164"/></linearGradient><linearGradient id="linearGradient153"><stop style="stop-color:#ffeed7;stop-opacity:1;" offset="0" id="stop154"/><stop style="stop-color:#bdbfc2;stop-opacity:1;" offset="1" id="stop155"/></linearGradient><linearGradient id="linearGradient138"><stop style="stop-color:#ffffff;stop-opacity:0.8;" offset="0" id="stop139"/><stop style="stop-color:#ffffff;stop-opacity:0;" offset="1" id="stop140"/></linearGradient><linearGradient xlink:href="#linearGradient138" id="linearGradient141" x1="0.47424799" y1="0.020191999" x2="0.417539" y2="0.90125799" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient142" x1="0.55880702" y1="0.031192999" x2="0.553922" y2="0.94531101" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient143" x1="0.46557701" y1="0.028819799" x2="0.41365999" y2="0.93366498" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient144" x1="0.70346397" y1="0.059404202" x2="0.64553201" y2="0.94063401" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient145" x1="0.46741399" y1="-0.036155298" x2="0.86741799" y2="0.75857902" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient146" x1="0.57152498" y1="0.023441499" x2="0.57143003" y2="0.71875" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient147" x1="0.5" y1="0.0234362" x2="0.5" y2="0.8125" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient148" x1="0.50799799" y1="0.37435901" x2="0.51599997" y2="0.92820501" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient138" id="linearGradient149" x1="0.5" y1="0.131707" x2="0.50400001" y2="0.94634098" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient167" id="linearGradient150" x1="-0.30509499" y1="0.099496603" x2="0.156323" y2="0.94191301" gradientUnits="objectBoundingBox" gradientTransform="matrix(-0.928523,0.283938,0.435332,0.943857,-1.91327e-7,5.49908e-8)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient151" x1="0.433979" y1="0.022184599" x2="0.487055" y2="1.02569" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient152" x1="0.5" y1="0.89842999" x2="0.5" y2="0.40625" gradientUnits="objectBoundingBox" spreadMethod="reflect"/><linearGradient xlink:href="#linearGradient153" id="linearGradient156" x1="0.43568701" y1="0.98882002" x2="0.453989" y2="0.23093501" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient157" x1="0.49180499" y1="1.15284" x2="0.49482101" y2="0.41252401" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient158" x1="0.51730198" y1="0.85418499" x2="0.49843901" y2="0.136172" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient153" id="linearGradient159" x1="0.46201" y1="0.87917101" x2="0.49215299" y2="0.096282303" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient161" x1="0.50086302" y1="0.34872901" x2="0.41209599" y2="0.98558098" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient165" x1="0.60399801" y1="0.51020199" x2="0.46399999" y2="0.98367399" gradientUnits="objectBoundingBox"/><linearGradient xlink:href="#linearGradient162" id="linearGradient166" x1="0.50000501" y1="0.191616" x2="0.50800002" y2="0.97005898" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient171" cx="0.5" cy="0.5" fx="0.5" fy="0.5" r="0.5" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient176"/><linearGradient xlink:href="#linearGradient153" id="linearGradient178" x1="0.94027299" y1="1.2934099" x2="0.19452" y2="-0.675295" gradientUnits="objectBoundingBox"/><radialGradient xlink:href="#linearGradient172" id="radialGradient1399" gradientTransform="scale(1.045233,0.956725)" cx="446.77762" cy="1219.4125" fx="446.77762" fy="1219.4125" r="195.07191" gradientUnits="userSpaceOnUse"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1401" gradientUnits="userSpaceOnUse" x1="400.57785" y1="369.53015" x2="400.84448" y2="304.07886" gradientTransform="scale(0.575262,1.738339)"/><linearGradient xlink:href="#linearGradient138" id="linearGradient1403" gradientUnits="userSpaceOnUse" x1="303.01761" y1="237.93179" x2="297.0856" y2="330.09561" gradientTransform="scale(1.116071,0.896001)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1405" gradientUnits="userSpaceOnUse" gradientTransform="scale(0.816497,1.224744)" x1="378.93771" y1="278.60202" x2="380.27319" y2="243.91606"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1407" gradientUnits="userSpaceOnUse" x1="381.38742" y1="277.495" x2="380.5517" y2="245.68338" gradientTransform="scale(0.816497,1.224744)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1409" gradientUnits="userSpaceOnUse" gradientTransform="scale(0.816497,1.224744)" x1="379.09573" y1="240.92712" x2="376.79556" y2="281.01636"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1411" gradientUnits="userSpaceOnUse" x1="389.63535" y1="242.28218" x2="387.06866" y2="281.32513" gradientTransform="scale(0.816497,1.224744)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1413" gradientUnits="userSpaceOnUse" spreadMethod="reflect" x1="437.57941" y1="528.87177" x2="437.57941" y2="394.10361" gradientTransform="scale(0.812855,1.230232)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1415" gradientUnits="userSpaceOnUse" x1="375.17325" y1="419.78485" x2="377.48541" y2="324.03815" gradientTransform="scale(0.649784,1.538974)"/><linearGradient xlink:href="#linearGradient138" id="linearGradient1417" gradientUnits="userSpaceOnUse" x1="320.75104" y1="498.17776" x2="321.32224" y2="614.50439" gradientTransform="scale(1.074798,0.930408)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1419" gradientUnits="userSpaceOnUse" x1="322.48257" y1="435.26761" x2="323.2514" y2="488.48251" gradientTransform="scale(1.077001,0.928504)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1421" gradientUnits="userSpaceOnUse" x1="411.2215" y1="242.94365" x2="411.2215" y2="331.44858" gradientTransform="scale(0.571707,1.749147)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1423" gradientUnits="userSpaceOnUse" x1="867.34546" y1="234.73897" x2="867.33453" y2="314.83911" gradientTransform="scale(0.572667,1.746214)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1425" gradientUnits="userSpaceOnUse" x1="236.25362" y1="657.11133" x2="212.5099" y2="737.41229" gradientTransform="scale(1.011514,0.988617)"/><linearGradient xlink:href="#linearGradient153" id="linearGradient1427" gradientUnits="userSpaceOnUse" x1="381.56607" y1="655.73102" x2="279.64313" y2="386.66583" gradientTransform="scale(1.065499,0.938527)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1429" gradientUnits="userSpaceOnUse" x1="218.11714" y1="630.30475" x2="203.12654" y2="737.8537" gradientTransform="scale(1.009851,0.990245)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1431" gradientUnits="userSpaceOnUse" gradientTransform="scale(1.007724,0.992335)" x1="117.88966" y1="587.23602" x2="182.24524" y2="704.73077"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1433" gradientUnits="userSpaceOnUse" x1="223.10072" y1="570.41809" x2="230.53499" y2="710.97723" gradientTransform="scale(0.999504,1.000496)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1435" gradientUnits="userSpaceOnUse" x1="316.93988" y1="474.01779" x2="371.60889" y2="582.63507" gradientTransform="scale(1.065499,0.938527)"/><linearGradient xlink:href="#linearGradient162" id="linearGradient1437" gradientUnits="userSpaceOnUse" x1="284.68652" y1="410.46326" x2="285.45923" y2="485.69934" gradientTransform="scale(1.218684,0.820557)"/><linearGradient xlink:href="#linearGradient167" id="linearGradient1439" gradientUnits="userSpaceOnUse" x1="288.82358" y1="398.85422" x2="288.37628" y2="482.55939" gradientTransform="scale(1.221941,0.81837)"/></defs><g id="g1369" transform="translate(-310.7524,-64.25268)"><path transform="matrix(1.4177,0,0,0.414745,-38.7944,222.194)" d="M 670.88202 1166.6423 A 203.89551 186.63016 0 1 1 263.091,1166.6423 A 203.89551 186.63016 0 1 1 670.88202 1166.6423 z" id="path175" style="fill:url(#radialGradient1399);stroke:none;stroke-width:1pt;stroke-linecap:butt;stroke-linejoin:miter"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path106" d="M 223.627,632.24 C 201.239,600.017 196.873,495.256 249.114,430.81 C 275,399.892 281.604,378.345 283.645,349.417 C 285.034,316.438 260.32,217.975 353.528,210.473 C 447.934,202.941 442.864,296.133 442.321,345.448 C 441.87,387.088 472.895,410.689 494.117,443.143 C 533.396,502.773 530.074,605.443 486.718,661.015 C 431.801,730.583 384.765,700.413 353.528,702.945 C 295.035,706.147 293.101,737.336 223.627,632.24 z " style="fill:#000000;stroke:none;stroke-width:1.25;"/><path transform="matrix(-1.67739,-2.24516e-2,-2.11236e-2,1.4709,1173.58,-293.017)" id="path113" d="M 246.571,470.864 C 234.332,483.36 202.175,539.956 251.44,576.224 C 268.809,588.857 235.063,635.719 219.435,612.532 C 191.865,570.914 210.604,505.591 227.75,482.344 C 239.402,465.857 256.98,459.668 246.571,470.864 z " style="fill:url(#linearGradient1401);stroke:none;stroke-width:0.99464899;"/><path transform="matrix(-1.67755,0,0,1.52374,1174.62,-318.082)" id="path111" d="M 256.513,459.837 C 236.598,477.554 200.337,539.928 253.225,580.443 C 270.595,593.075 237.832,632.906 219.435,612.532 C 155.472,541.712 221.104,460.278 243.697,432.282 C 263.889,407.935 281.775,438.034 256.513,459.837 z " style="fill:#000000;stroke:#000000;stroke-width:0.97729802;"/><path transform="matrix(1.26626,-7.13667e-2,-4.59795e-2,1.19574,202.143,-125.761)" d="M 399.56879 258.15753 A 58.37323 46.863022 0 1 1 282.82233,258.15753 A 58.37323 46.863022 0 1 1 399.56879 258.15753 z" id="path114" style="fill:url(#linearGradient1403);stroke:none;stroke-width:1.26498997;"/><path transform="matrix(1.30445,-7.55326e-2,7.71251e-2,1.34257,144.757,-177.617)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path115" style="fill:url(#linearGradient1405);stroke:none;stroke-width:1.17873001;"/><path transform="matrix(-1.81082,4.95107e-2,3.17324e-2,1.55333,1207.46,-284.777)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path116" style="fill:url(#linearGradient1407);stroke:none;stroke-width:0.93138498;"/><path transform="matrix(-0.823196,-1.76123e-3,-1.82321e-2,0.852662,913.674,-37.9902)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path117" style="fill:#000000;stroke:none;stroke-width:1.86495996;"/><path transform="matrix(0.59438,-7.22959e-2,6.88176e-2,0.705838,367.448,32.4186)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path118" style="fill:#000000;stroke:none;stroke-width:2.39814997;"/><path transform="matrix(-0.480323,-3.6454e-2,-4.67935e-2,0.475606,813.496,87.0124)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path121" style="fill:url(#linearGradient1409);stroke:none;stroke-width:3.1916101;"/><path transform="matrix(0.35691,-4.08211e-2,4.13232e-2,0.398544,449.334,114.991)" d="M 328.86324 320.64151 A 18.087479 27.131195 0 1 1 292.68828,320.64151 A 18.087479 27.131195 0 1 1 328.86324 320.64151 z" id="path122" style="fill:url(#linearGradient1411);stroke:none;stroke-width:4.12025976;"/><path transform="matrix(1.25,0,0,1.25,185.454,-168.23)" id="path128" d="M 258.702,495.425 C 271.538,466.322 298.816,415.199 299.397,375.667 C 299.397,344.225 393.576,336.716 401.134,368.109 C 408.692,399.502 427.875,446.592 440.084,469.265 C 452.292,491.937 487.893,563.96 449.968,626.811 C 415.811,682.455 312.243,726.477 256.958,619.254 C 238.355,582.047 241.673,535.939 258.702,495.425 z " style="fill:url(#linearGradient1413);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.38936,-0.111074,0.102211,1.30214,108.413,-165.938)" id="path112" d="M 242.905,473.815 C 231.642,492.782 207.405,543.124 255.042,575.862 C 306.353,610.682 301.515,672.924 239.435,637.817 C 182.658,606.028 216.59,500.039 234.925,475.551 C 247.032,458.337 264.822,437.52 242.905,473.815 z " style="fill:url(#linearGradient1415);stroke:none;stroke-width:1.15804005;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path109" d="M 256.513,449.72 C 239.048,478.228 197.136,545.533 253.225,580.443 C 328.794,626.798 307.398,673.154 238.426,631.417 C 141.317,573.153 226.601,455.801 265.557,411.079 C 310.001,360.879 274.111,420.166 256.513,449.72 z " style="fill:#000000;stroke:#000000;stroke-width:1.25;"/><path id="path125" d="M 421.481,504.727 C 421.481,537.139 392.209,579.243 341.953,578.865 C 290.125,579.32 268.004,537.139 268.004,504.727 C 268.004,472.315 302.383,446.01 344.743,446.01 C 387.102,446.01 421.481,472.315 421.481,504.727 z " style="font-size:12px;fill:url(#linearGradient1417);stroke:none;stroke-width:1.23705006;stroke-dasharray:none" transform="matrix(1.30209,0,0,1.22525,170.042,-153.557)"/><path id="path127" d="M 398.227,412.292 C 397.615,450.864 375.047,459.963 346.487,459.963 C 317.926,459.963 297.195,454.269 294.746,412.292 C 294.746,385.978 317.926,370.75 346.487,370.75 C 375.047,370.75 398.227,385.978 398.227,412.292 z " style="font-size:12px;fill:url(#linearGradient1419);stroke:none;stroke-width:1.38846004;stroke-dasharray:none" transform="matrix(1.1868,0,0,1.06708,210.623,-100.078)"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path129" d="M 234.285,456.475 C 252.001,429.479 289.3,388.111 241.262,462.288 C 202.311,523.331 226.859,562.561 239.518,573.327 C 276.045,605.889 274.484,627.676 245.913,610.533 C 184.288,573.907 197.078,512.285 234.285,456.475 z " style="fill:url(#linearGradient1421);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path131" d="M 490.662,467.52 C 475.343,435.819 426.528,355.618 492.988,448.917 C 553.449,533.214 511.01,591.93 503.452,597.744 C 495.895,603.557 470.315,615.184 477.873,594.837 C 485.43,574.49 523.107,535.864 490.662,467.52 z " style="fill:url(#linearGradient1423);stroke:none;stroke-width:1.25;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path132" d="M 220.915,716.921 C 180.473,695.505 121.663,721.045 143.013,662.855 C 147.289,649.617 136.638,629.847 143.594,616.929 C 151.733,601.231 169.174,604.72 179.639,594.255 C 189.957,583.364 196.498,564.606 215.683,567.513 C 234.867,570.42 247.628,593.974 261.027,622.742 C 270.91,643.38 305.968,672.406 303.677,695.5 C 300.981,731 260.65,737.69 220.915,716.921 z " style="fill:url(#linearGradient1425);stroke:#e68c3f;stroke-width:6.25;"/><path id="path177" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:url(#linearGradient1427);stroke:none;stroke-width:2.85509992;stroke-dasharray:none" transform="matrix(0.598206,0.268584,-0.239623,0.617213,700.568,140.464)"/><path transform="matrix(-1.1685,0.423145,0.475283,1.16478,728.343,-213.821)" id="path133" d="M 220.274,718.402 C 178.947,694.812 120.38,724.007 143.013,662.855 C 147.749,649.787 136.417,629.303 143.373,616.385 C 151.512,600.687 169.174,604.72 179.639,594.255 C 189.957,583.364 198.466,566.387 217.651,569.294 C 236.835,572.201 247.628,593.974 261.027,622.742 C 270.91,643.38 304.442,671.713 302.151,694.807 C 299.455,730.307 259.427,740.278 220.274,718.402 z " style="fill:url(#linearGradient1429);stroke:#e68c3f;stroke-width:6.25067997;"/><path transform="matrix(-0.945096,0.343745,0.424076,0.956058,714.328,-64.342)" id="path134" d="M 216.482,675.68 C 129.951,618.177 169.174,604.72 179.639,594.255 C 189.957,583.364 198.466,566.387 217.651,569.294 C 236.835,572.201 247.628,593.974 261.027,622.742 C 270.91,643.38 304.087,671.66 302.151,694.807 C 299.535,721.917 253.961,700.294 216.482,675.68 z " style="fill:url(#linearGradient1431);stroke:none;stroke-width:1.52532005;"/><path transform="matrix(1.00431,-5.2286e-2,-1.74e-2,1.04575,244.191,-28.4653)" id="path135" d="M 216.506,677.071 C 129.975,619.568 169.709,603.501 182.56,595.791 C 197.959,585.849 197.718,564.96 216.903,567.867 C 236.087,570.774 247.628,593.974 261.027,622.742 C 270.91,643.38 304.087,671.66 302.151,694.807 C 299.535,721.917 253.985,701.685 216.506,677.071 z " style="fill:url(#linearGradient1433);stroke:none;stroke-width:1.52532005;"/><path id="path136" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:#000000;stroke:none;stroke-width:2.85509992;" transform="matrix(0.515584,0.215259,-0.206526,0.49467,713.3,222.559)"/><path id="path137" d="M 415.072,495.764 C 412.065,520.67 379.259,572.391 345.554,577.298 C 311.294,582.634 279.122,543.238 271.407,506.184 C 261.518,464.978 293.994,448.584 343.345,449.557 C 396.646,451.211 417.466,463.448 415.072,495.764 z " style="font-size:12px;fill:url(#linearGradient1435);stroke:none;stroke-width:2.85509992;" transform="matrix(0.351231,0.149463,-0.128856,0.343469,724.522,318.291)"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path119" d="M 309.954,338.729 C 317.101,331.959 334.765,311.663 367.915,332.974 C 374.077,336.984 379.077,337.351 390.936,342.429 C 414.662,352.178 403.318,375.688 378.192,383.537 C 367.434,387.026 357.656,400.093 338.063,398.976 C 321.329,397.999 316.944,387.102 306.665,381.07 C 288.396,370.759 285.7,356.816 295.565,349.417 C 305.431,342.018 309.29,339.358 309.954,338.729 z " style="fill:url(#linearGradient1437);stroke:#e68c3f;stroke-width:3.75;"/><path transform="matrix(1.25,0,0,1.25,185.454,-167.505)" id="path120" d="M 391.251,357.645 C 381.368,358.226 359.858,379.736 337.185,379.736 C 314.512,379.736 301.141,358.807 297.653,358.807" style="fill:none;stroke:#e68c3f;stroke-width:2.5;"/><path transform="matrix(0.627885,0,0,0.595666,392.366,51.8173)" id="path123" d="M 309.954,338.729 C 317.101,331.959 339.645,313.381 369.542,332.401 C 375.841,336.167 382.346,340.266 392.02,345.865 C 411.182,357.613 401.691,374.543 378.734,385.255 C 368.316,389.75 351.141,399.67 338.063,398.976 C 323.53,397.568 314.128,387.577 304.496,381.07 C 286.826,368.767 287.899,358.833 296.107,350.562 C 302.312,344.883 309.29,339.358 309.954,338.729 z " style="fill:url(#linearGradient1439);stroke:none;"/></g></svg>'
+	);
 	height: 50px;
 	padding-left: 50px;
 	padding-top: 10px;
@@ -1442,7 +1477,7 @@ $site-lexicon-icon-color: #5AF;
 // Tables Page
 
 #verticalAlignTableListDemo {
-	background-color: #F5F7F8;
+	background-color: #f5f7f8;
 
 	tr {
 		height: 120px;
@@ -1460,14 +1495,26 @@ $site-lexicon-icon-color: #5AF;
 
 // Typography Page
 
-.clay-site-sans-serif { font-family: $font-family-sans-serif; }
-.clay-site-sans-serif::after { content: '#{$font-family-sans-serif}'; }
+.clay-site-sans-serif {
+	font-family: $font-family-sans-serif;
+}
+.clay-site-sans-serif::after {
+	content: '#{$font-family-sans-serif}';
+}
 
-.clay-site-serif { font-family: $font-family-serif; }
-.clay-site-serif::after { content: '#{$font-family-serif}'; }
+.clay-site-serif {
+	font-family: $font-family-serif;
+}
+.clay-site-serif::after {
+	content: '#{$font-family-serif}';
+}
 
-.clay-site-monospace { font-family: $font-family-monospace; }
-.clay-site-monospace::after { content: '#{$font-family-monospace}'; }
+.clay-site-monospace {
+	font-family: $font-family-monospace;
+}
+.clay-site-monospace::after {
+	content: '#{$font-family-monospace}';
+}
 
 // Site Main Nav
 
@@ -1490,7 +1537,7 @@ $site-lexicon-icon-color: #5AF;
 }
 
 .menu-toggle {
-	color: #FFF;
+	color: #fff;
 	display: block;
 	float: left;
 	padding: 10px 15px;
@@ -1512,7 +1559,8 @@ $mainNavWidth: 220px;
 	right: 0;
 	top: 0;
 
-	@include media-breakpoint-up(md) { // min-width 768px
+	@include media-breakpoint-up(md) {
+		// min-width 768px
 		position: static;
 	}
 }
@@ -1521,12 +1569,14 @@ $mainNavWidth: 220px;
 	left: 0;
 	position: relative;
 
-	@include media-breakpoint-up(md) { // min-width 768px
+	@include media-breakpoint-up(md) {
+		// min-width 768px
 		padding-left: $mainNavWidth + 20;
 	}
 
-	[dir="rtl"] & {
-		@include media-breakpoint-up(md) { // min-width 768px
+	[dir='rtl'] & {
+		@include media-breakpoint-up(md) {
+			// min-width 768px
 			padding-left: 0;
 			padding-right: $mainNavWidth + 20;
 		}
@@ -1539,7 +1589,8 @@ $mainNavWidth: 220px;
 	visibility: hidden;
 	width: 0;
 
-	@include media-breakpoint-up(md) { // min-width 768px
+	@include media-breakpoint-up(md) {
+		// min-width 768px
 		visibility: visible;
 		width: $mainNavWidth;
 	}
@@ -1559,7 +1610,8 @@ $mainNavWidth: 220px;
 	height: 100%;
 	overflow-x: hidden;
 
-	@include media-breakpoint-up(md) { // min-width 768px
+	@include media-breakpoint-up(md) {
+		// min-width 768px
 		overflow-x: visible;
 	}
 
@@ -1571,7 +1623,8 @@ $mainNavWidth: 220px;
 	#mainContent {
 		left: $mainNavWidth + 10;
 
-		@include media-breakpoint-up(md) { // min-width 768px
+		@include media-breakpoint-up(md) {
+			// min-width 768px
 			left: auto;
 			position: static;
 		}
@@ -1597,15 +1650,17 @@ $mainNavWidth: 220px;
 
 	li {
 		> a {
-			&:hover, &:focus {
+			&:hover,
+			&:focus {
 				background-color: transparent;
 				text-decoration: underline;
 			}
 		}
 
-		&.child-active, &.active {
+		&.child-active,
+		&.active {
 			> a {
-				color: #0058BA;
+				color: #0058ba;
 				font-weight: bold;
 			}
 		}
@@ -1618,12 +1673,12 @@ $mainNavWidth: 220px;
 		}
 
 		> h4 {
-			color: #F3F3F3;
+			color: #f3f3f3;
 			padding: 10px 15px;
 		}
 
 		div > .main-nav-section {
-			border-left: 3px solid #E4E4E4;
+			border-left: 3px solid #e4e4e4;
 			margin-left: 15px;
 
 			li {
@@ -1633,9 +1688,10 @@ $mainNavWidth: 220px;
 					padding-left: 10px;
 				}
 
-				&.child-active, &.active {
+				&.child-active,
+				&.active {
 					> a {
-						border-left: 3px solid #0058BA;
+						border-left: 3px solid #0058ba;
 						margin-left: -3px;
 					}
 				}
@@ -1650,7 +1706,12 @@ $mainNavWidth: 220px;
 
 // Metalsmith Headings Identifiers
 
-h1, h2, h3, h4, h5, h6 {
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
 	.heading-anchor {
 		align-items: center;
 		color: inherit;
@@ -1670,7 +1731,8 @@ h1, h2, h3, h4, h5, h6 {
 		}
 	}
 
-	@include media-breakpoint-up(md) { // min-width 768px
+	@include media-breakpoint-up(md) {
+		// min-width 768px
 		.heading-anchor {
 			float: none;
 			margin-left: -32px;
@@ -1709,23 +1771,25 @@ body.sidenav-transition {
 #mySidebar {
 	background-color: #222328;
 	box-shadow: -3px 0 3px -3px #000 inset;
-	color: #F8F8F8;
+	color: #f8f8f8;
 
 	ul {
-		border-bottom: 1px solid #3E3E3E;
+		border-bottom: 1px solid #3e3e3e;
 		border-top: 1px solid #000;
 
 		li {
 			border-bottom: 1px solid #000;
-			border-top: 1px solid #3E3E3E;
+			border-top: 1px solid #3e3e3e;
 			margin-top: 0;
 
 			a {
-				background-color: #2C2D32;
+				background-color: #2c2d32;
 				box-shadow: -3px 0 3px -3px #000 inset;
 
-				&, &:hover, &:focus {
-					color: #B3B6BC;
+				&,
+				&:hover,
+				&:focus {
+					color: #b3b6bc;
 					font-weight: 200;
 					text-shadow: 0 1px 0 #000;
 				}
@@ -1743,15 +1807,15 @@ body.sidenav-transition {
 	margin-top: 20px;
 
 	h4 {
-		border-bottom: 2px dotted #AEAEAE;
-		color: #BA3A37;
+		border-bottom: 2px dotted #aeaeae;
+		color: #ba3a37;
 		margin: 20px 0;
 		padding-bottom: 8px;
 	}
 
 	.sidenav-main-content h3 {
-		border-bottom: 1px solid #1E2639;
-		color: #F8F8F8;
+		border-bottom: 1px solid #1e2639;
+		color: #f8f8f8;
 		margin: 0 -20px;
 		padding: 15px;
 	}
@@ -1764,7 +1828,7 @@ body.sidenav-transition {
 
 // Side Navigation RTL
 
-[dir="rtl"] {
+[dir='rtl'] {
 	.sidenav-fixed > .sidenav-menu-slider {
 		left: auto;
 		right: 0;
@@ -1805,22 +1869,25 @@ body.sidenav-transition {
 // API Page
 
 $my-button-variant: () !default;
-$my-button-variant: map-merge((
-	bg: #C142A0,
-	border-width: 0,
-	color: #FFF,
-	font-size: 13px,
-	font-weight: 700,
-	line-height: 1,
-	padding-bottom: 12px,
-	padding-left: 15px,
-	padding-right: 15px,
-	padding-top: 12px,
-	hover-bg: #AC388E,
-	hover-color: #FFF,
-	active-bg: #9D3381,
-), $my-button-variant);
+$my-button-variant: map-merge(
+	(
+		bg: #c142a0,
+		border-width: 0,
+		color: #fff,
+		font-size: 13px,
+		font-weight: 700,
+		line-height: 1,
+		padding-bottom: 12px,
+		padding-left: 15px,
+		padding-right: 15px,
+		padding-top: 12px,
+		hover-bg: #ac388e,
+		hover-color: #fff,
+		active-bg: #9d3381,
+	),
+	$my-button-variant
+);
 
 .my-button-variant {
 	@include clay-button-variant($my-button-variant);
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/site/site-atlas-font-awesome.scss b/packages/clay-css/src/scss/site/site-atlas-font-awesome.scss
index ea9c3b9930..43a7fbfd44 100644
--- a/packages/clay-css/src/scss/site/site-atlas-font-awesome.scss
+++ b/packages/clay-css/src/scss/site/site-atlas-font-awesome.scss
@@ -1,8 +1,8 @@
-@import "../atlas";
+@import '../atlas';
 
-@import "site";
+@import 'site';
 
 #claySiteCSS {
 	content: 'clay-atlas';
 	display: none;
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/site/site-lexicon-font-awesome.scss b/packages/clay-css/src/scss/site/site-lexicon-font-awesome.scss
index 32224f795a..6861e7f73f 100644
--- a/packages/clay-css/src/scss/site/site-lexicon-font-awesome.scss
+++ b/packages/clay-css/src/scss/site/site-lexicon-font-awesome.scss
@@ -1,8 +1,8 @@
-@import "../base";
+@import '../base';
 
-@import "site";
+@import 'site';
 
 #claySiteCSS {
 	content: 'clay-base';
 	display: none;
-}
\ No newline at end of file
+}
diff --git a/packages/clay-css/src/scss/site/site-main.scss b/packages/clay-css/src/scss/site/site-main.scss
index 8bd45303ef..1320a208a8 100644
--- a/packages/clay-css/src/scss/site/site-main.scss
+++ b/packages/clay-css/src/scss/site/site-main.scss
@@ -1,3 +1,3 @@
 // @import "../atlas-variables";
 
-// @import "site";
\ No newline at end of file
+// @import "site";
diff --git a/packages/clay-css/src/scss/variables/_alerts.scss b/packages/clay-css/src/scss/variables/_alerts.scss
index 762fd0741b..5e1caf2da2 100644
--- a/packages/clay-css/src/scss/variables/_alerts.scss
+++ b/packages/clay-css/src/scss/variables/_alerts.scss
@@ -5,21 +5,27 @@
 $alert-border-style: solid !default;
 
 $alert-btn: () !default;
-$alert-btn: map-deep-merge((
-	border-radius: $btn-border-radius-sm,
-	font-size: $btn-font-size-sm,
-	line-height: $btn-line-height-sm,
-	padding-bottom: $btn-padding-y-sm,
-	padding-left: $btn-padding-x-sm,
-	padding-right: $btn-padding-x-sm,
-	padding-top: $btn-padding-y-sm,
-), $alert-btn);
+$alert-btn: map-deep-merge(
+	(
+		border-radius: $btn-border-radius-sm,
+		font-size: $btn-font-size-sm,
+		line-height: $btn-line-height-sm,
+		padding-bottom: $btn-padding-y-sm,
+		padding-left: $btn-padding-x-sm,
+		padding-right: $btn-padding-x-sm,
+		padding-top: $btn-padding-y-sm,
+	),
+	$alert-btn
+);
 
 $alert-btn-group-item: () !default;
-$alert-btn-group-item: map-deep-merge((
-	margin-bottom: 0.125rem,
-	margin-top: 0.125rem,
-), $alert-btn-group-item);
+$alert-btn-group-item: map-deep-merge(
+	(
+		margin-bottom: 0.125rem,
+		margin-top: 0.125rem,
+	),
+	$alert-btn-group-item
+);
 
 /// @deprecated as of v2.12.0 use the Sass map `$alert-close` instead
 
@@ -70,20 +76,23 @@ $alert-close-position-top: 0.75rem !default; // 12px
 $alert-close-width: $alert-close-height !default;
 
 $alert-close: () !default;
-$alert-close: map-deep-merge((
-	font-size: $alert-close-font-size,
-	height: $alert-close-height,
-	line-height: $alert-close-line-height,
-	margin-left: $alert-close-margin-left,
-	opacity: $alert-close-opacity,
-	padding-bottom: $alert-close-padding-bottom,
-	padding-left: $alert-close-padding-left,
-	padding-right: $alert-close-padding-right,
-	padding-top: $alert-close-padding-top,
-	right: $alert-close-position-right,
-	top: $alert-close-position-top,
-	width: $alert-close-width,
-), $alert-close);
+$alert-close: map-deep-merge(
+	(
+		font-size: $alert-close-font-size,
+		height: $alert-close-height,
+		line-height: $alert-close-line-height,
+		margin-left: $alert-close-margin-left,
+		opacity: $alert-close-opacity,
+		padding-bottom: $alert-close-padding-bottom,
+		padding-left: $alert-close-padding-left,
+		padding-right: $alert-close-padding-right,
+		padding-top: $alert-close-padding-top,
+		right: $alert-close-position-right,
+		top: $alert-close-position-top,
+		width: $alert-close-width,
+	),
+	$alert-close
+);
 
 $alert-font-size: null !default;
 
@@ -101,9 +110,12 @@ $alert-title: () !default;
 $alert-subtitle: () !default;
 
 $alert-footer: () !default;
-$alert-footer: map-deep-merge((
-	margin-top: 1.375rem,
-), $alert-footer);
+$alert-footer: map-deep-merge(
+	(
+		margin-top: 1.375rem,
+	),
+	$alert-footer
+);
 
 // Alert Dismissible
 
@@ -119,7 +131,9 @@ $alert-fluid-border-left-width: 0 !default;
 $alert-fluid-border-right-width: 0 !default;
 $alert-fluid-border-top-width: 0 !default;
 
-$alert-fluid-border-width: $alert-fluid-border-top-width $alert-fluid-border-right-width $alert-fluid-border-bottom-width $alert-fluid-border-left-width !default;
+$alert-fluid-border-width: $alert-fluid-border-top-width
+	$alert-fluid-border-right-width $alert-fluid-border-bottom-width
+	$alert-fluid-border-left-width !default;
 $alert-fluid-margin-bottom: 0 !default;
 
 // Alert Notification
@@ -132,7 +146,7 @@ $alert-notifications-absolute-top: 4.75rem !default; // 76px
 $alert-notifications-absolute-bottom-mobile: null !default;
 $alert-notifications-absolute-left-mobile: 0.5rem !default; // 8px
 $alert-notifications-absolute-right-mobile: 0.5rem !default; // 8px
-$alert-notifications-absolute-top-mobile: 4.25rem!default; // 68px
+$alert-notifications-absolute-top-mobile: 4.25rem !default; // 68px
 
 $alert-notifications-fixed-bottom: 1.25rem !default; // 20px
 $alert-notifications-fixed-left: 1.25rem !default; // 20px
@@ -150,12 +164,15 @@ $alert-notifications-max-width: 22.5rem !default; // 360px
 // Alert Autofit Row
 
 $alert-autofit-row: () !default;
-$alert-autofit-row: map-deep-merge((
-	margin-left: -0.5rem,
-	margin-right: -0.5rem,
-	autofit-col-padding-left: 0.5rem,
-	autofit-col-padding-right: 0.5rem,
-), $alert-autofit-row);
+$alert-autofit-row: map-deep-merge(
+	(
+		margin-left: -0.5rem,
+		margin-right: -0.5rem,
+		autofit-col-padding-left: 0.5rem,
+		autofit-col-padding-right: 0.5rem,
+	),
+	$alert-autofit-row
+);
 
 // Alert Variants
 
@@ -168,15 +185,18 @@ $alert-primary-lead-color: null !default;
 $alert-primary-link-color: null !default;
 $alert-primary-link-hover-color: null !default;
 $alert-primary-btn: () !default;
-$alert-primary-btn: map-deep-merge((
-	bg: $white,
-	border-color: $primary,
-	color: $primary,
-	hover-bg: $primary,
-	hover-color: color-yiq($primary),
-	active-bg: darken($primary, 5%),
-	active-border-color: darken($primary, 5%),
-), $alert-primary-btn);
+$alert-primary-btn: map-deep-merge(
+	(
+		bg: $white,
+		border-color: $primary,
+		color: $primary,
+		hover-bg: $primary,
+		hover-color: color-yiq($primary),
+		active-bg: darken($primary, 5%),
+		active-border-color: darken($primary, 5%),
+	),
+	$alert-primary-btn
+);
 
 $alert-secondary-bg: null !default;
 $alert-secondary-border-color: null !default;
@@ -187,15 +207,18 @@ $alert-secondary-lead-color: null !default;
 $alert-secondary-link-color: null !default;
 $alert-secondary-link-hover-color: null !default;
 $alert-secondary-btn: () !default;
-$alert-secondary-btn: map-deep-merge((
-	bg: $white,
-	border-color: $secondary,
-	color: $secondary,
-	hover-bg: $secondary,
-	hover-color: color-yiq($secondary),
-	active-bg: darken($secondary, 5%),
-	active-border-color: darken($secondary, 5%),
-), $alert-secondary-btn);
+$alert-secondary-btn: map-deep-merge(
+	(
+		bg: $white,
+		border-color: $secondary,
+		color: $secondary,
+		hover-bg: $secondary,
+		hover-color: color-yiq($secondary),
+		active-bg: darken($secondary, 5%),
+		active-border-color: darken($secondary, 5%),
+	),
+	$alert-secondary-btn
+);
 
 $alert-success-bg: null !default;
 $alert-success-border-color: null !default;
@@ -206,15 +229,18 @@ $alert-success-lead-color: null !default;
 $alert-success-link-color: null !default;
 $alert-success-link-hover-color: null !default;
 $alert-success-btn: () !default;
-$alert-success-btn: map-deep-merge((
-	bg: $white,
-	border-color: $success,
-	color: $success,
-	hover-bg: $success,
-	hover-color: color-yiq($success),
-	active-bg: darken($success, 5%),
-	active-border-color: darken($success, 5%),
-), $alert-success-btn);
+$alert-success-btn: map-deep-merge(
+	(
+		bg: $white,
+		border-color: $success,
+		color: $success,
+		hover-bg: $success,
+		hover-color: color-yiq($success),
+		active-bg: darken($success, 5%),
+		active-border-color: darken($success, 5%),
+	),
+	$alert-success-btn
+);
 
 $alert-info-bg: null !default;
 $alert-info-border-color: null !default;
@@ -225,15 +251,18 @@ $alert-info-lead-color: null !default;
 $alert-info-link-color: null !default;
 $alert-info-link-hover-color: null !default;
 $alert-info-btn: () !default;
-$alert-info-btn: map-deep-merge((
-	bg: $white,
-	border-color: $info,
-	color: $info,
-	hover-bg: $info,
-	hover-color: color-yiq($info),
-	active-bg: darken($info, 5%),
-	active-border-color: darken($info, 5%),
-), $alert-info-btn);
+$alert-info-btn: map-deep-merge(
+	(
+		bg: $white,
+		border-color: $info,
+		color: $info,
+		hover-bg: $info,
+		hover-color: color-yiq($info),
+		active-bg: darken($info, 5%),
+		active-border-color: darken($info, 5%),
+	),
+	$alert-info-btn
+);
 
 $alert-warning-bg: null !default;
 $alert-warning-border-color: null !default;
@@ -244,15 +273,18 @@ $alert-warning-lead-color: null !default;
 $alert-warning-link-color: null !default;
 $alert-warning-link-hover-color: null !default;
 $alert-warning-btn: () !default;
-$alert-warning-btn: map-deep-merge((
-	bg: $white,
-	border-color: $warning,
-	color: $warning,
-	hover-bg: $warning,
-	hover-color: color-yiq($warning),
-	active-bg: darken($warning, 5%),
-	active-border-color: darken($warning, 5%),
-), $alert-warning-btn);
+$alert-warning-btn: map-deep-merge(
+	(
+		bg: $white,
+		border-color: $warning,
+		color: $warning,
+		hover-bg: $warning,
+		hover-color: color-yiq($warning),
+		active-bg: darken($warning, 5%),
+		active-border-color: darken($warning, 5%),
+	),
+	$alert-warning-btn
+);
 
 $alert-danger-bg: null !default;
 $alert-danger-border-color: null !default;
@@ -263,15 +295,18 @@ $alert-danger-lead-color: null !default;
 $alert-danger-link-color: null !default;
 $alert-danger-link-hover-color: null !default;
 $alert-danger-btn: () !default;
-$alert-danger-btn: map-deep-merge((
-	bg: $white,
-	border-color: $danger,
-	color: $danger,
-	hover-bg: $danger,
-	hover-color: color-yiq($danger),
-	active-bg: darken($danger, 5%),
-	active-border-color: darken($danger, 5%),
-), $alert-danger-btn);
+$alert-danger-btn: map-deep-merge(
+	(
+		bg: $white,
+		border-color: $danger,
+		color: $danger,
+		hover-bg: $danger,
+		hover-color: color-yiq($danger),
+		active-bg: darken($danger, 5%),
+		active-border-color: darken($danger, 5%),
+	),
+	$alert-danger-btn
+);
 
 $alert-light-bg: null !default;
 $alert-light-border-color: null !default;
@@ -282,15 +317,18 @@ $alert-light-lead-color: null !default;
 $alert-light-link-color: null !default;
 $alert-light-link-hover-color: null !default;
 $alert-light-btn: () !default;
-$alert-light-btn: map-deep-merge((
-	bg: $white,
-	border-color: $secondary,
-	color: $secondary,
-	hover-bg: $secondary,
-	hover-color: color-yiq($secondary),
-	active-bg: darken($secondary, 5%),
-	active-border-color: darken($secondary, 5%),
-), $alert-light-btn);
+$alert-light-btn: map-deep-merge(
+	(
+		bg: $white,
+		border-color: $secondary,
+		color: $secondary,
+		hover-bg: $secondary,
+		hover-color: color-yiq($secondary),
+		active-bg: darken($secondary, 5%),
+		active-border-color: darken($secondary, 5%),
+	),
+	$alert-light-btn
+);
 
 $alert-dark-bg: null !default;
 $alert-dark-border-color: null !default;
@@ -301,104 +339,110 @@ $alert-dark-lead-color: null !default;
 $alert-dark-link-color: null !default;
 $alert-dark-link-hover-color: null !default;
 $alert-dark-btn: () !default;
-$alert-dark-btn: map-deep-merge((
-	bg: $white,
-	border-color: $dark,
-	color: $dark,
-	hover-bg: $dark,
-	hover-color: color-yiq($dark),
-	active-bg: darken($dark, 5%),
-	active-border-color: darken($dark, 5%),
-), $alert-dark-btn);
+$alert-dark-btn: map-deep-merge(
+	(
+		bg: $white,
+		border-color: $dark,
+		color: $dark,
+		hover-bg: $dark,
+		hover-color: color-yiq($dark),
+		active-bg: darken($dark, 5%),
+		active-border-color: darken($dark, 5%),
+	),
+	$alert-dark-btn
+);
 
 $alert-palette: () !default;
-$alert-palette: map-deep-merge((
-	primary: (
-		bg: $alert-primary-bg,
-		border-color: $alert-primary-border-color,
-		color: $alert-primary-color,
-		close-color: $alert-primary-close-color,
-		close-hover-color: $alert-primary-close-hover-color,
-		lead-color: $alert-primary-lead-color,
-		link-color: $alert-primary-link-color,
-		link-hover-color: $alert-primary-link-hover-color,
-		alert-btn: $alert-primary-btn,
-	),
-	secondary: (
-		bg: $alert-secondary-bg,
-		border-color: $alert-secondary-border-color,
-		color: $alert-secondary-color,
-		close-color: $alert-secondary-close-color,
-		close-hover-color: $alert-secondary-close-hover-color,
-		lead-color: $alert-secondary-lead-color,
-		link-color: $alert-secondary-link-color,
-		link-hover-color: $alert-secondary-link-hover-color,
-		alert-btn: $alert-secondary-btn,
-	),
-	success: (
-		bg: $alert-success-bg,
-		border-color: $alert-success-border-color,
-		color: $alert-success-color,
-		close-color: $alert-success-close-color,
-		close-hover-color: $alert-success-close-hover-color,
-		lead-color: $alert-success-lead-color,
-		link-color: $alert-success-link-color,
-		link-hover-color: $alert-success-link-hover-color,
-		alert-btn: $alert-success-btn,
-	),
-	info: (
-		bg: $alert-info-bg,
-		border-color: $alert-info-border-color,
-		color: $alert-info-color,
-		close-color: $alert-info-close-color,
-		close-hover-color: $alert-info-close-hover-color,
-		lead-color: $alert-info-lead-color,
-		link-color: $alert-info-link-color,
-		link-hover-color: $alert-info-link-hover-color,
-		alert-btn: $alert-info-btn,
-	),
-	warning: (
-		bg: $alert-warning-bg,
-		border-color: $alert-warning-border-color,
-		color: $alert-warning-color,
-		close-color: $alert-warning-close-color,
-		close-hover-color: $alert-warning-close-hover-color,
-		lead-color: $alert-warning-lead-color,
-		link-color: $alert-warning-link-color,
-		link-hover-color: $alert-warning-link-hover-color,
-		alert-btn: $alert-warning-btn,
-	),
-	danger: (
-		bg: $alert-danger-bg,
-		border-color: $alert-danger-border-color,
-		color: $alert-danger-color,
-		close-color: $alert-danger-close-color,
-		close-hover-color: $alert-danger-close-hover-color,
-		lead-color: $alert-danger-lead-color,
-		link-color: $alert-danger-link-color,
-		link-hover-color: $alert-danger-link-hover-color,
-		alert-btn: $alert-danger-btn,
-	),
-	light: (
-		bg: $alert-light-bg,
-		border-color: $alert-light-border-color,
-		color: $alert-light-color,
-		close-color: $alert-light-close-color,
-		close-hover-color: $alert-light-close-hover-color,
-		lead-color: $alert-light-lead-color,
-		link-color: $alert-light-link-color,
-		link-hover-color: $alert-light-link-hover-color,
-		alert-btn: $alert-light-btn,
-	),
-	dark: (
-		bg: $alert-dark-bg,
-		border-color: $alert-dark-border-color,
-		color: $alert-dark-color,
-		close-color: $alert-dark-close-color,
-		close-hover-color: $alert-dark-close-hover-color,
-		lead-color: $alert-dark-lead-color,
-		link-color: $alert-dark-link-color,
-		link-hover-color: $alert-dark-link-hover-color,
-		alert-btn: $alert-dark-btn,
+$alert-palette: map-deep-merge(
+	(
+		primary: (
+			bg: $alert-primary-bg,
+			border-color: $alert-primary-border-color,
+			color: $alert-primary-color,
+			close-color: $alert-primary-close-color,
+			close-hover-color: $alert-primary-close-hover-color,
+			lead-color: $alert-primary-lead-color,
+			link-color: $alert-primary-link-color,
+			link-hover-color: $alert-primary-link-hover-color,
+			alert-btn: $alert-primary-btn,
+		),
+		secondary: (
+			bg: $alert-secondary-bg,
+			border-color: $alert-secondary-border-color,
+			color: $alert-secondary-color,
+			close-color: $alert-secondary-close-color,
+			close-hover-color: $alert-secondary-close-hover-color,
+			lead-color: $alert-secondary-lead-color,
+			link-color: $alert-secondary-link-color,
+			link-hover-color: $alert-secondary-link-hover-color,
+			alert-btn: $alert-secondary-btn,
+		),
+		success: (
+			bg: $alert-success-bg,
+			border-color: $alert-success-border-color,
+			color: $alert-success-color,
+			close-color: $alert-success-close-color,
+			close-hover-color: $alert-success-close-hover-color,
+			lead-color: $alert-success-lead-color,
+			link-color: $alert-success-link-color,
+			link-hover-color: $alert-success-link-hover-color,
+			alert-btn: $alert-success-btn,
+		),
+		info: (
+			bg: $alert-info-bg,
+			border-color: $alert-info-border-color,
+			color: $alert-info-color,
+			close-color: $alert-info-close-color,
+			close-hover-color: $alert-info-close-hover-color,
+			lead-color: $alert-info-lead-color,
+			link-color: $alert-info-link-color,
+			link-hover-color: $alert-info-link-hover-color,
+			alert-btn: $alert-info-btn,
+		),
+		warning: (
+			bg: $alert-warning-bg,
+			border-color: $alert-warning-border-color,
+			color: $alert-warning-color,
+			close-color: $alert-warning-close-color,
+			close-hover-color: $alert-warning-close-hover-color,
+			lead-color: $alert-warning-lead-color,
+			link-color: $alert-warning-link-color,
+			link-hover-color: $alert-warning-link-hover-color,
+			alert-btn: $alert-warning-btn,
+		),
+		danger: (
+			bg: $alert-danger-bg,
+			border-color: $alert-danger-border-color,
+			color: $alert-danger-color,
+			close-color: $alert-danger-close-color,
+			close-hover-color: $alert-danger-close-hover-color,
+			lead-color: $alert-danger-lead-color,
+			link-color: $alert-danger-link-color,
+			link-hover-color: $alert-danger-link-hover-color,
+			alert-btn: $alert-danger-btn,
+		),
+		light: (
+			bg: $alert-light-bg,
+			border-color: $alert-light-border-color,
+			color: $alert-light-color,
+			close-color: $alert-light-close-color,
+			close-hover-color: $alert-light-close-hover-color,
+			lead-color: $alert-light-lead-color,
+			link-color: $alert-light-link-color,
+			link-hover-color: $alert-light-link-hover-color,
+			alert-btn: $alert-light-btn,
+		),
+		dark: (
+			bg: $alert-dark-bg,
+			border-color: $alert-dark-border-color,
+			color: $alert-dark-color,
+			close-color: $alert-dark-close-color,
+			close-hover-color: $alert-dark-close-hover-color,
+			lead-color: $alert-dark-lead-color,
+			link-color: $alert-dark-link-color,
+			link-hover-color: $alert-dark-link-hover-color,
+			alert-btn: $alert-dark-btn,
+		),
 	),
-), $alert-palette);
\ No newline at end of file
+	$alert-palette
+);
diff --git a/packages/clay-css/src/scss/variables/_application-bar.scss b/packages/clay-css/src/scss/variables/_application-bar.scss
index 3fb4c1d36f..e0cc8cb3fb 100644
--- a/packages/clay-css/src/scss/variables/_application-bar.scss
+++ b/packages/clay-css/src/scss/variables/_application-bar.scss
@@ -1,27 +1,33 @@
 $application-bar-size: () !default;
-$application-bar-size: map-deep-merge((
-	scaling-navbar: true,
-	font-size: $navbar-font-size,
-	height: 3.5rem,
-	height-mobile: 3rem,
-	btn-monospaced-font-size: 1rem,
-	link-height: 2rem,
-	link-height-mobile: 2rem,
-	link-margin-x: 0.5rem,
-	link-padding-x: 0.25rem,
-	padding-x: 0,
-	padding-y: 0
-), $application-bar-size);
+$application-bar-size: map-deep-merge(
+	(
+		scaling-navbar: true,
+		font-size: $navbar-font-size,
+		height: 3.5rem,
+		height-mobile: 3rem,
+		btn-monospaced-font-size: 1rem,
+		link-height: 2rem,
+		link-height-mobile: 2rem,
+		link-margin-x: 0.5rem,
+		link-padding-x: 0.25rem,
+		padding-x: 0,
+		padding-y: 0,
+	),
+	$application-bar-size
+);
 
 $application-bar-base: () !default;
 
 $application-bar-dark: () !default;
-$application-bar-dark: map-deep-merge((
-	bg: $dark,
-	color: $navbar-dark-color,
-	link-color: $navbar-dark-color,
-	link-hover-color: $navbar-dark-hover-color,
-	link-active-color: $navbar-dark-active-color,
-	link-disabled-color: $navbar-dark-disabled-color,
-	link-disabled-opacity: 1
-), $application-bar-dark);
\ No newline at end of file
+$application-bar-dark: map-deep-merge(
+	(
+		bg: $dark,
+		color: $navbar-dark-color,
+		link-color: $navbar-dark-color,
+		link-hover-color: $navbar-dark-hover-color,
+		link-active-color: $navbar-dark-active-color,
+		link-disabled-color: $navbar-dark-disabled-color,
+		link-disabled-opacity: 1,
+	),
+	$application-bar-dark
+);
diff --git a/packages/clay-css/src/scss/variables/_badges.scss b/packages/clay-css/src/scss/variables/_badges.scss
index 5190758e55..8916db3cf2 100644
--- a/packages/clay-css/src/scss/variables/_badges.scss
+++ b/packages/clay-css/src/scss/variables/_badges.scss
@@ -19,18 +19,21 @@ $badge-link-text-decoration: underline !default;
 $badge-link-hover-text-decoration: none !default;
 
 $badge-close: () !default;
-$badge-close: map-deep-merge((
-	color: inherit,
-	opacity: 1,
-	hover-color: inherit,
-	hover-opacity: 1,
-	focus-opacity: 1,
-	border-radius: 1px,
-	display: inline-flex,
-	font-size: inherit,
-	height: auto,
-	width: auto
-), $badge-close);
+$badge-close: map-deep-merge(
+	(
+		color: inherit,
+		opacity: 1,
+		hover-color: inherit,
+		hover-opacity: 1,
+		focus-opacity: 1,
+		border-radius: 1px,
+		display: inline-flex,
+		font-size: inherit,
+		height: auto,
+		width: auto,
+	),
+	$badge-close
+);
 
 // Badge Variants
 
@@ -107,85 +110,88 @@ $badge-dark-link-color: null !default;
 $badge-dark-link-hover-color: null !default;
 
 $badge-palette: () !default;
-$badge-palette: map-deep-merge((
-	primary: (
-		bg: $badge-primary-bg,
-		hover-bg: $badge-primary-hover-bg,
-		border-color: $badge-primary-border-color,
-		hover-border-color: $badge-primary-hover-border-color,
-		color: $badge-primary-color,
-		hover-color: $badge-primary-hover-color,
-		link-color: $badge-primary-link-color,
-		link-hover-color: $badge-primary-link-hover-color
-	),
-	secondary: (
-		bg: $badge-secondary-bg,
-		hover-bg: $badge-secondary-hover-bg,
-		border-color: $badge-secondary-border-color,
-		hover-border-color: $badge-secondary-hover-border-color,
-		color: $badge-secondary-color,
-		hover-color: $badge-secondary-hover-color,
-		link-color: $badge-secondary-link-color,
-		link-hover-color: $badge-secondary-link-hover-color
-	),
-	success: (
-		bg: $badge-success-bg,
-		hover-bg: $badge-success-hover-bg,
-		border-color: $badge-success-border-color,
-		hover-border-color: $badge-success-hover-border-color,
-		color: $badge-success-color,
-		hover-color: $badge-success-hover-color,
-		link-color: $badge-success-link-color,
-		link-hover-color: $badge-success-link-hover-color
-	),
-	info: (
-		bg: $badge-info-bg,
-		hover-bg: $badge-info-hover-bg,
-		border-color: $badge-info-border-color,
-		hover-border-color: $badge-info-hover-border-color,
-		color: $badge-info-color,
-		hover-color: $badge-info-hover-color,
-		link-color: $badge-info-link-color,
-		link-hover-color: $badge-info-link-hover-color
-	),
-	warning: (
-		bg: $badge-warning-bg,
-		hover-bg: $badge-warning-hover-bg,
-		border-color: $badge-warning-border-color,
-		hover-border-color: $badge-warning-hover-border-color,
-		color: $badge-warning-color,
-		hover-color: $badge-warning-hover-color,
-		link-color: $badge-warning-link-color,
-		link-hover-color: $badge-warning-link-hover-color
-	),
-	danger: (
-		bg: $badge-danger-bg,
-		hover-bg: $badge-danger-hover-bg,
-		border-color: $badge-danger-border-color,
-		hover-border-color: $badge-danger-hover-border-color,
-		color: $badge-danger-color,
-		hover-color: $badge-danger-hover-color,
-		link-color: $badge-danger-link-color,
-		link-hover-color: $badge-danger-link-hover-color
-	),
-	light: (
-		bg: $badge-light-bg,
-		hover-bg: $badge-light-hover-bg,
-		border-color: $badge-light-border-color,
-		hover-border-color: $badge-light-hover-border-color,
-		color: $badge-light-color,
-		hover-color: $badge-light-hover-color,
-		link-color: $badge-light-link-color,
-		link-hover-color: $badge-light-link-hover-color
+$badge-palette: map-deep-merge(
+	(
+		primary: (
+			bg: $badge-primary-bg,
+			hover-bg: $badge-primary-hover-bg,
+			border-color: $badge-primary-border-color,
+			hover-border-color: $badge-primary-hover-border-color,
+			color: $badge-primary-color,
+			hover-color: $badge-primary-hover-color,
+			link-color: $badge-primary-link-color,
+			link-hover-color: $badge-primary-link-hover-color,
+		),
+		secondary: (
+			bg: $badge-secondary-bg,
+			hover-bg: $badge-secondary-hover-bg,
+			border-color: $badge-secondary-border-color,
+			hover-border-color: $badge-secondary-hover-border-color,
+			color: $badge-secondary-color,
+			hover-color: $badge-secondary-hover-color,
+			link-color: $badge-secondary-link-color,
+			link-hover-color: $badge-secondary-link-hover-color,
+		),
+		success: (
+			bg: $badge-success-bg,
+			hover-bg: $badge-success-hover-bg,
+			border-color: $badge-success-border-color,
+			hover-border-color: $badge-success-hover-border-color,
+			color: $badge-success-color,
+			hover-color: $badge-success-hover-color,
+			link-color: $badge-success-link-color,
+			link-hover-color: $badge-success-link-hover-color,
+		),
+		info: (
+			bg: $badge-info-bg,
+			hover-bg: $badge-info-hover-bg,
+			border-color: $badge-info-border-color,
+			hover-border-color: $badge-info-hover-border-color,
+			color: $badge-info-color,
+			hover-color: $badge-info-hover-color,
+			link-color: $badge-info-link-color,
+			link-hover-color: $badge-info-link-hover-color,
+		),
+		warning: (
+			bg: $badge-warning-bg,
+			hover-bg: $badge-warning-hover-bg,
+			border-color: $badge-warning-border-color,
+			hover-border-color: $badge-warning-hover-border-color,
+			color: $badge-warning-color,
+			hover-color: $badge-warning-hover-color,
+			link-color: $badge-warning-link-color,
+			link-hover-color: $badge-warning-link-hover-color,
+		),
+		danger: (
+			bg: $badge-danger-bg,
+			hover-bg: $badge-danger-hover-bg,
+			border-color: $badge-danger-border-color,
+			hover-border-color: $badge-danger-hover-border-color,
+			color: $badge-danger-color,
+			hover-color: $badge-danger-hover-color,
+			link-color: $badge-danger-link-color,
+			link-hover-color: $badge-danger-link-hover-color,
+		),
+		light: (
+			bg: $badge-light-bg,
+			hover-bg: $badge-light-hover-bg,
+			border-color: $badge-light-border-color,
+			hover-border-color: $badge-light-hover-border-color,
+			color: $badge-light-color,
+			hover-color: $badge-light-hover-color,
+			link-color: $badge-light-link-color,
+			link-hover-color: $badge-light-link-hover-color,
+		),
+		dark: (
+			bg: $badge-dark-bg,
+			hover-bg: $badge-dark-hover-bg,
+			border-color: $badge-dark-border-color,
+			hover-border-color: $badge-dark-hover-border-color,
+			color: $badge-dark-color,
+			hover-color: $badge-dark-hover-color,
+			link-color: $badge-dark-link-color,
+			link-hover-color: $badge-dark-link-hover-color,
+		),
 	),
-	dark: (
-		bg: $badge-dark-bg,
-		hover-bg: $badge-dark-hover-bg,
-		border-color: $badge-dark-border-color,
-		hover-border-color: $badge-dark-hover-border-color,
-		color: $badge-dark-color,
-		hover-color: $badge-dark-hover-color,
-		link-color: $badge-dark-link-color,
-		link-hover-color: $badge-dark-link-hover-color
-	)
-), $badge-palette);
\ No newline at end of file
+	$badge-palette
+);
diff --git a/packages/clay-css/src/scss/variables/_breadcrumbs.scss b/packages/clay-css/src/scss/variables/_breadcrumbs.scss
index aae5822f48..e8a6f7d914 100644
--- a/packages/clay-css/src/scss/variables/_breadcrumbs.scss
+++ b/packages/clay-css/src/scss/variables/_breadcrumbs.scss
@@ -5,8 +5,10 @@ $breadcrumb-text-transform: null !default;
 $breadcrumb-active-font-weight: null !default;
 
 $breadcrumb-text-truncate-icon-spacer-x: 0.875rem !default; // 14px
-$breadcrumb-text-truncate-max-width: 18.75rem - $breadcrumb-text-truncate-icon-spacer-x !default; // 300px
-$breadcrumb-text-truncate-max-width-mobile: 9.375rem - $breadcrumb-text-truncate-icon-spacer-x !default; // 150px
+$breadcrumb-text-truncate-max-width: 18.75rem -
+	$breadcrumb-text-truncate-icon-spacer-x !default; // 300px
+$breadcrumb-text-truncate-max-width-mobile: 9.375rem -
+	$breadcrumb-text-truncate-icon-spacer-x !default; // 150px
 
 $breadcrumb-link-color: $link-color !default;
 $breadcrumb-link-text-decoration: $link-decoration !default;
@@ -15,21 +17,27 @@ $breadcrumb-link-hover-color: $link-hover-color !default;
 $breadcrumb-link-hover-text-decoration: $link-hover-decoration !default;
 
 $breadcrumb-link: () !default;
-$breadcrumb-link: map-deep-merge((
-	color: $breadcrumb-link-color,
-	display: block,
-	text-decoration: $breadcrumb-link-text-decoration,
-	text-transform: $breadcrumb-text-transform,
-	hover-color: $breadcrumb-link-hover-color,
-	hover-text-decoration: $breadcrumb-link-hover-text-decoration,
-	focus-color: $breadcrumb-link-hover-color,
-	focus-text-decoration: $breadcrumb-link-hover-text-decoration,
-), $breadcrumb-link);
+$breadcrumb-link: map-deep-merge(
+	(
+		color: $breadcrumb-link-color,
+		display: block,
+		text-decoration: $breadcrumb-link-text-decoration,
+		text-transform: $breadcrumb-text-transform,
+		hover-color: $breadcrumb-link-hover-color,
+		hover-text-decoration: $breadcrumb-link-hover-text-decoration,
+		focus-color: $breadcrumb-link-hover-color,
+		focus-text-decoration: $breadcrumb-link-hover-text-decoration,
+	),
+	$breadcrumb-link
+);
 
 $breadcrumb-divider-color: $breadcrumb-active-color !default;
 $breadcrumb-divider-font-family: null !default;
 $breadcrumb-divider-font-weight: null !default;
 
-$breadcrumb-divider-svg-icon: clay-icon(angle-right, $breadcrumb-divider-color) !default;
+$breadcrumb-divider-svg-icon: clay-icon(
+	angle-right,
+	$breadcrumb-divider-color
+) !default;
 $breadcrumb-divider-svg-icon-height: 0.75em !default;
-$breadcrumb-divider-svg-icon-width: $breadcrumb-divider-svg-icon-height !default;
\ No newline at end of file
+$breadcrumb-divider-svg-icon-width: $breadcrumb-divider-svg-icon-height !default;
diff --git a/packages/clay-css/src/scss/variables/_bs4-variable-overwrites.scss b/packages/clay-css/src/scss/variables/_bs4-variable-overwrites.scss
index 619d971e34..809c7f8a50 100644
--- a/packages/clay-css/src/scss/variables/_bs4-variable-overwrites.scss
+++ b/packages/clay-css/src/scss/variables/_bs4-variable-overwrites.scss
@@ -3,32 +3,50 @@
 
 // More semantic variable name: maps Clay CSS `$component-focus-box-shadow` to Bootstrap's `$input-btn-focus-box-shadow` for global focus styles
 
-$white: #FFF !default;
-$blue: #007BFF !default;
+$white: #fff !default;
+$blue: #007bff !default;
 $primary: $blue !default;
 $component-active-color: $white !default;
 $component-active-bg: $primary !default;
-$input-btn-focus-width: .2rem !default;
-$input-btn-focus-color: rgba($component-active-bg, .25) !default;
+$input-btn-focus-width: 0.2rem !default;
+$input-btn-focus-color: rgba($component-active-bg, 0.25) !default;
 $component-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default;
-$component-focus-inset-box-shadow: inset 0 0 0 $input-btn-focus-width $input-btn-focus-color !default;
+$component-focus-inset-box-shadow: inset 0 0 0 $input-btn-focus-width
+	$input-btn-focus-color !default;
 $input-btn-focus-box-shadow: $component-focus-box-shadow !default;
 
 $enable-caret: false !default;
 
 $spacer: 1rem !default;
 $spacers: () !default;
-$spacers: map-deep-merge((
-	0: 0,
-	1: ($spacer * .25),
-	2: ($spacer * .5),
-	3: $spacer,
-	4: ($spacer * 1.5),
-	5: ($spacer * 3),
-	6: ($spacer * 4.5),
-	7: ($spacer * 6),
-	8: ($spacer * 7.5),
-), $spacers);
+$spacers: map-deep-merge(
+	(
+		0: 0,
+		1: (
+			$spacer * 0.25,
+		),
+		2: (
+			$spacer * 0.5,
+		),
+		3: $spacer,
+		4: (
+			$spacer * 1.5,
+		),
+		5: (
+			$spacer * 3,
+		),
+		6: (
+			$spacer * 4.5,
+		),
+		7: (
+			$spacer * 6,
+		),
+		8: (
+			$spacer * 7.5,
+		),
+	),
+	$spacers
+);
 
 $input-border-width: 0.0625rem !default; // 1px
 $input-height: 2.375rem !default; // 38px
@@ -39,7 +57,7 @@ $form-check-input-gutter: 0 !default;
 $form-check-input-margin-y: 0 !default;
 $form-check-inline-input-margin-x: auto !default;
 
-$table-accent-bg: #F2F2F2 !default;
-$table-hover-bg: #ECECEC !default;
+$table-accent-bg: #f2f2f2 !default;
+$table-hover-bg: #ececec !default;
 
-$table-head-bg: #FFF !default;
\ No newline at end of file
+$table-head-bg: #fff !default;
diff --git a/packages/clay-css/src/scss/variables/_buttons.scss b/packages/clay-css/src/scss/variables/_buttons.scss
index d57fbafa62..08d5422e1d 100644
--- a/packages/clay-css/src/scss/variables/_buttons.scss
+++ b/packages/clay-css/src/scss/variables/_buttons.scss
@@ -58,52 +58,73 @@ $btn-toolbar-spacer-y: 0.125rem !default; // 2px
 // Button Variants
 
 $btn-primary: () !default;
-$btn-primary: map-deep-merge((
-	loading-animation: 'loading-animation-light'
-), $btn-primary);
+$btn-primary: map-deep-merge(
+	(
+		loading-animation: 'loading-animation-light',
+	),
+	$btn-primary
+);
 
 $btn-secondary: () !default;
-$btn-secondary: map-deep-merge((
-	loading-animation: 'loading-animation-light'
-), $btn-secondary);
+$btn-secondary: map-deep-merge(
+	(
+		loading-animation: 'loading-animation-light',
+	),
+	$btn-secondary
+);
 
 $btn-success: () !default;
-$btn-success: map-deep-merge((
-	loading-animation: 'loading-animation-light'
-), $btn-success);
+$btn-success: map-deep-merge(
+	(
+		loading-animation: 'loading-animation-light',
+	),
+	$btn-success
+);
 
 $btn-info: () !default;
-$btn-info: map-deep-merge((
-	loading-animation: 'loading-animation-light'
-), $btn-info);
+$btn-info: map-deep-merge(
+	(
+		loading-animation: 'loading-animation-light',
+	),
+	$btn-info
+);
 
 $btn-warning: () !default;
 $btn-warning: map-deep-merge((), $btn-warning);
 
 $btn-danger: () !default;
-$btn-danger: map-deep-merge((
-	loading-animation: 'loading-animation-light'
-), $btn-danger);
+$btn-danger: map-deep-merge(
+	(
+		loading-animation: 'loading-animation-light',
+	),
+	$btn-danger
+);
 
 $btn-light: () !default;
 $btn-light: map-deep-merge((), $btn-light);
 
 $btn-dark: () !default;
-$btn-dark: map-deep-merge((
-	loading-animation: 'loading-animation-light'
-), $btn-dark);
+$btn-dark: map-deep-merge(
+	(
+		loading-animation: 'loading-animation-light',
+	),
+	$btn-dark
+);
 
 $btn-palette: () !default;
-$btn-palette: map-deep-merge((
-	primary: $btn-primary,
-	secondary: $btn-secondary,
-	success: $btn-success,
-	info: $btn-info,
-	warning: $btn-warning,
-	danger: $btn-danger,
-	light: $btn-light,
-	dark: $btn-dark
-), $btn-palette);
+$btn-palette: map-deep-merge(
+	(
+		primary: $btn-primary,
+		secondary: $btn-secondary,
+		success: $btn-success,
+		info: $btn-info,
+		warning: $btn-warning,
+		danger: $btn-danger,
+		light: $btn-light,
+		dark: $btn-dark,
+	),
+	$btn-palette
+);
 
 // Button Outline Variants
 
@@ -117,13 +138,16 @@ $btn-outline-light: () !default;
 $btn-outline-dark: () !default;
 
 $btn-outline-palette: () !default;
-$btn-outline-palette: map-deep-merge((
-	primary: $btn-outline-primary,
-	secondary: $btn-outline-secondary,
-	success: $btn-outline-success,
-	info: $btn-outline-info,
-	warning: $btn-outline-warning,
-	danger: $btn-outline-danger,
-	light: $btn-outline-light,
-	dark: $btn-outline-dark
-), $btn-outline-palette);
\ No newline at end of file
+$btn-outline-palette: map-deep-merge(
+	(
+		primary: $btn-outline-primary,
+		secondary: $btn-outline-secondary,
+		success: $btn-outline-success,
+		info: $btn-outline-info,
+		warning: $btn-outline-warning,
+		danger: $btn-outline-danger,
+		light: $btn-outline-light,
+		dark: $btn-outline-dark,
+	),
+	$btn-outline-palette
+);
diff --git a/packages/clay-css/src/scss/variables/_cards.scss b/packages/clay-css/src/scss/variables/_cards.scss
index 4a71575309..4468636394 100644
--- a/packages/clay-css/src/scss/variables/_cards.scss
+++ b/packages/clay-css/src/scss/variables/_cards.scss
@@ -18,92 +18,131 @@ $card-section-header-text-transform: uppercase !default;
 // Card Aspect Ratio
 
 $card-aspect-ratio-label: () !default;
-$card-aspect-ratio-label: map-deep-merge((
-	display: block,
-	margin-bottom: 0.5rem,
-	margin-left: 0,
-	margin-right: 0,
-	margin-top: 0.5rem,
-), $card-aspect-ratio-label);
+$card-aspect-ratio-label: map-deep-merge(
+	(
+		display: block,
+		margin-bottom: 0.5rem,
+		margin-left: 0,
+		margin-right: 0,
+		margin-top: 0.5rem,
+	),
+	$card-aspect-ratio-label
+);
 
 $card-aspect-ratio-item-top-left: () !default;
-$card-aspect-ratio-item-top-left: map-deep-merge((
-	left: 1rem,
-	top: 1rem,
-), $card-aspect-ratio-item-top-left);
+$card-aspect-ratio-item-top-left: map-deep-merge(
+	(
+		left: 1rem,
+		top: 1rem,
+	),
+	$card-aspect-ratio-item-top-left
+);
 
 $card-aspect-ratio-item-top-center: () !default;
-$card-aspect-ratio-item-top-center: map-deep-merge((
-	top: 1rem,
-), $card-aspect-ratio-item-top-center);
+$card-aspect-ratio-item-top-center: map-deep-merge(
+	(
+		top: 1rem,
+	),
+	$card-aspect-ratio-item-top-center
+);
 
 $card-aspect-ratio-item-top-right: () !default;
-$card-aspect-ratio-item-top-right: map-deep-merge((
-	right: 1rem,
-	top: 1rem,
-), $card-aspect-ratio-item-top-right);
+$card-aspect-ratio-item-top-right: map-deep-merge(
+	(
+		right: 1rem,
+		top: 1rem,
+	),
+	$card-aspect-ratio-item-top-right
+);
 
 $card-aspect-ratio-item-right-middle: () !default;
-$card-aspect-ratio-item-right-middle: map-deep-merge((
-	right: 1rem,
-), $card-aspect-ratio-item-right-middle);
+$card-aspect-ratio-item-right-middle: map-deep-merge(
+	(
+		right: 1rem,
+	),
+	$card-aspect-ratio-item-right-middle
+);
 
 $card-aspect-ratio-item-bottom-right: () !default;
-$card-aspect-ratio-item-bottom-right: map-deep-merge((
-	bottom: 1rem,
-	right: 1rem,
-), $card-aspect-ratio-item-bottom-right);
+$card-aspect-ratio-item-bottom-right: map-deep-merge(
+	(
+		bottom: 1rem,
+		right: 1rem,
+	),
+	$card-aspect-ratio-item-bottom-right
+);
 
 $card-aspect-ratio-item-bottom-center: () !default;
-$card-aspect-ratio-item-bottom-center: map-deep-merge((
-	bottom: 1rem,
-), $card-aspect-ratio-item-bottom-center);
+$card-aspect-ratio-item-bottom-center: map-deep-merge(
+	(
+		bottom: 1rem,
+	),
+	$card-aspect-ratio-item-bottom-center
+);
 
 $card-aspect-ratio-item-bottom-left: () !default;
-$card-aspect-ratio-item-bottom-left: map-deep-merge((
-	bottom: 1rem,
-	left: 1rem,
-), $card-aspect-ratio-item-bottom-left);
+$card-aspect-ratio-item-bottom-left: map-deep-merge(
+	(
+		bottom: 1rem,
+		left: 1rem,
+	),
+	$card-aspect-ratio-item-bottom-left
+);
 
 // Card Title
 
 $card-title: () !default;
-$card-title: map-deep-merge((
-	font-size: 1rem,
-	font-weight: $font-weight-semi-bold,
-	line-height: $line-height-base,
-	margin-bottom: 0
-), $card-title);
+$card-title: map-deep-merge(
+	(
+		font-size: 1rem,
+		font-weight: $font-weight-semi-bold,
+		line-height: $line-height-base,
+		margin-bottom: 0,
+	),
+	$card-title
+);
 
 $card-title-link: () !default;
-$card-title-link: map-deep-merge((
-	color: map-get($card-title, color)
-), $card-title-link);
+$card-title-link: map-deep-merge(
+	(
+		color: map-get($card-title, color),
+	),
+	$card-title-link
+);
 
 // Card Subtitle
 
 $card-subtitle: () !default;
-$card-subtitle: map-deep-merge((
-	color: $gray-600,
-	font-size: 0.875rem,
-	font-weight: $font-weight-semi-bold,
-	margin-bottom: 0,
-	margin-top: 0
-), $card-subtitle);
+$card-subtitle: map-deep-merge(
+	(
+		color: $gray-600,
+		font-size: 0.875rem,
+		font-weight: $font-weight-semi-bold,
+		margin-bottom: 0,
+		margin-top: 0,
+	),
+	$card-subtitle
+);
 
 $card-subtitle-link: () !default;
-$card-subtitle-link: map-deep-merge((
-	color: map-get($card-subtitle, color),
-	hover-color: darken($gray-600, 15%)
-), $card-subtitle-link);
+$card-subtitle-link: map-deep-merge(
+	(
+		color: map-get($card-subtitle, color),
+		hover-color: darken($gray-600, 15%),
+	),
+	$card-subtitle-link
+);
 
 // Card Link
 
 $card-link: () !default;
-$card-link: map-deep-merge((
-	color: $link-color,
-	hover-color: $link-hover-color
-), $card-link);
+$card-link: map-deep-merge(
+	(
+		color: $link-color,
+		hover-color: $link-hover-color,
+	),
+	$card-link
+);
 
 // Card Divider
 
@@ -112,9 +151,21 @@ $card-divider-height: 1px !default;
 $card-divider-spacer-x: null !default;
 $card-divider-spacer-y: 10px !default;
 
-$card-rounded-inner-border-radius: if($card-border-width > 0, calc(#{$rounded-border-radius} - #{$card-border-width}), $rounded-border-radius) !default;
-$card-rounded-0-inner-border-radius: if($rounded-0-border-radius > $card-border-width, calc(#{$rounded-0-border-radius} - #{$card-border-width}), 0) !default;
-$card-rounded-circle-inner-border-radius: if($card-border-width > 0, calc(#{$rounded-circle-border-radius} - #{$card-border-width}), $rounded-circle-border-radius) !default;
+$card-rounded-inner-border-radius: if(
+	$card-border-width > 0,
+	calc(#{$rounded-border-radius} - #{$card-border-width}),
+	$rounded-border-radius
+) !default;
+$card-rounded-0-inner-border-radius: if(
+	$rounded-0-border-radius > $card-border-width,
+	calc(#{$rounded-0-border-radius} - #{$card-border-width}),
+	0
+) !default;
+$card-rounded-circle-inner-border-radius: if(
+	$card-border-width > 0,
+	calc(#{$rounded-circle-border-radius} - #{$card-border-width}),
+	$rounded-circle-border-radius
+) !default;
 
 $checkbox-left-card-padding: 40px !default;
 $checkbox-right-card-padding: $checkbox-left-card-padding !default;
@@ -126,66 +177,84 @@ $form-check-card-checked-box-shadow: $input-btn-focus-box-shadow !default;
 // Card Interactive
 
 $card-interactive-after-highlight: () !default;
-$card-interactive-after-highlight: map-deep-merge((
-	border-radius: 0 0 $card-border-radius $card-border-radius,
-	bottom: -$card-border-width,
-	content: '',
-	height: 0,
-	left: -$card-border-width,
-	position: absolute,
-	right: -$card-border-width,
-	transition: height 0.15s ease-in-out,
-	hover-height: 4px,
-	focus-height: 4px,
-	active-height: 4px,
-), $card-interactive-after-highlight);
+$card-interactive-after-highlight: map-deep-merge(
+	(
+		border-radius: 0 0 $card-border-radius $card-border-radius,
+		bottom: -$card-border-width,
+		content: '',
+		height: 0,
+		left: -$card-border-width,
+		position: absolute,
+		right: -$card-border-width,
+		transition: height 0.15s ease-in-out,
+		hover-height: 4px,
+		focus-height: 4px,
+		active-height: 4px,
+	),
+	$card-interactive-after-highlight
+);
 
 $card-interactive-card-body: () !default;
-$card-interactive-card-body: map-deep-merge((
-	display: block,
-), $card-interactive-card-body);
+$card-interactive-card-body: map-deep-merge(
+	(
+		display: block,
+	),
+	$card-interactive-card-body
+);
 
 $card-interactive: () !default;
-$card-interactive: map-deep-merge((
-	cursor: $link-cursor,
-	outline: 0,
-	transition: $btn-transition,
-	hover-bg: $gray-100,
-	hover-text-decoration: none,
-	focus-border-color: $input-focus-border-color,
-	focus-box-shadow: $input-btn-focus-box-shadow,
-	active-bg: $gray-200,
-	after-highlight: $card-interactive-after-highlight,
-	card-body: $card-interactive-card-body,
-), $card-interactive);
+$card-interactive: map-deep-merge(
+	(
+		cursor: $link-cursor,
+		outline: 0,
+		transition: $btn-transition,
+		hover-bg: $gray-100,
+		hover-text-decoration: none,
+		focus-border-color: $input-focus-border-color,
+		focus-box-shadow: $input-btn-focus-box-shadow,
+		active-bg: $gray-200,
+		after-highlight: $card-interactive-after-highlight,
+		card-body: $card-interactive-card-body,
+	),
+	$card-interactive
+);
 
 // Card Interactive Primary
 
 $card-interactive-primary-after-highlight: () !default;
-$card-interactive-primary-after-highlight: map-deep-merge((
-	hover-bg: $component-active-bg,
-	focus-bg: $component-active-bg,
-	active-bg: $component-active-bg,
-), $card-interactive-primary-after-highlight);
+$card-interactive-primary-after-highlight: map-deep-merge(
+	(
+		hover-bg: $component-active-bg,
+		focus-bg: $component-active-bg,
+		active-bg: $component-active-bg,
+	),
+	$card-interactive-primary-after-highlight
+);
 
 $card-interactive-primary: () !default;
-$card-interactive-primary: map-deep-merge((
-	focus-bg: $gray-100,
-	active-bg: $gray-200,
-	after-highlight: $card-interactive-primary-after-highlight,
-), $card-interactive-primary);
+$card-interactive-primary: map-deep-merge(
+	(
+		focus-bg: $gray-100,
+		active-bg: $gray-200,
+		after-highlight: $card-interactive-primary-after-highlight,
+	),
+	$card-interactive-primary
+);
 
 // Card Interactive Secondary
 
 $card-interactive-secondary: () !default;
-$card-interactive-secondary: map-deep-merge((
-	color: $gray-900,
-	hover-color: $gray-900,
-	hover-bg: $white,
-	hover-border-color: $input-focus-border-color,
-	hover-box-shadow: $input-btn-focus-box-shadow,
-	active-bg: $white,
-), $card-interactive-secondary);
+$card-interactive-secondary: map-deep-merge(
+	(
+		color: $gray-900,
+		hover-color: $gray-900,
+		hover-bg: $white,
+		hover-border-color: $input-focus-border-color,
+		hover-box-shadow: $input-btn-focus-box-shadow,
+		active-bg: $white,
+	),
+	$card-interactive-secondary
+);
 
 // Card Type Asset
 
@@ -198,43 +267,52 @@ $image-card: () !default;
 // File Card
 
 $file-card: () !default;
-$file-card: map-deep-merge((
-	asset-icon-color: $gray-600
-), $file-card);
+$file-card: map-deep-merge(
+	(
+		asset-icon-color: $gray-600,
+	),
+	$file-card
+);
 
 // Product Card
 
 $product-card: () !default;
-$product-card: map-deep-merge((
-	aspect-ratio: (
-		bg: $white,
-		bg-image: linear-gradient(0deg, #EBEBEB, #EBEBEB),
-	),
-	card-body: (
-		text-align: center,
+$product-card: map-deep-merge(
+	(
+		aspect-ratio: (
+			bg: $white,
+			bg-image: linear-gradient(0deg, #ebebeb, #ebebeb),
+		),
+		card-body: (
+			text-align: center,
+		),
+		card-title: (
+			font-size: 1rem,
+		),
+		card-subtitle: (
+			font-size: 0.75rem,
+		),
+		card-text: (
+			font-size: 1.125rem,
+			font-weight: $font-weight-semi-bold,
+		),
 	),
-	card-title: (
-		font-size: 1rem,
-	),
-	card-subtitle: (
-		font-size: 0.75rem,
-	),
-	card-text: (
-		font-size: 1.125rem,
-		font-weight: $font-weight-semi-bold,
-	),
-), $product-card);
+	$product-card
+);
 
 // User Card
 
 $user-card: () !default;
-$user-card: map-deep-merge((
-	asset-icon-max-width: 80px,
-	asset-icon-min-width: 48px,
-	asset-icon-width: 30%,
-	asset-icon-lexicon-icon-height: auto,
-	asset-icon-lexicon-icon-width: 50%,
-), $user-card);
+$user-card: map-deep-merge(
+	(
+		asset-icon-max-width: 80px,
+		asset-icon-min-width: 48px,
+		asset-icon-width: 30%,
+		asset-icon-lexicon-icon-height: auto,
+		asset-icon-lexicon-icon-width: 50%,
+	),
+	$user-card
+);
 
 // Card Page Item Asset
 
@@ -242,152 +320,195 @@ $user-card: map-deep-merge((
 // lg: min-width: 992px
 
 $card-page-item-asset: () !default;
-$card-page-item-asset: map-deep-merge((
-	base: (
-		breakpoint: 0,
-		min-width: 200px,
-		padding-left: $grid-gutter-width / 2,
-		padding-right: $grid-gutter-width / 2,
-	),
-	sm: (
-		breakpoint: map-get($grid-breakpoints, sm),
-		flex-basis: 50%,
-		max-width: 50%,
-	),
-	md: (
-		breakpoint: map-get($grid-breakpoints, md),
-		flex-basis: 33.3333%,
-		max-width: 33.3333%,
-	),
-	lg: (
-		breakpoint: map-get($grid-breakpoints, lg),
-		flex-basis: 25%,
-		max-width: 25%,
-	)
-), $card-page-item-asset);
+$card-page-item-asset: map-deep-merge(
+	(
+		base: (
+			breakpoint: 0,
+			min-width: 200px,
+			padding-left: $grid-gutter-width / 2,
+			padding-right: $grid-gutter-width / 2,
+		),
+		sm: (
+			breakpoint: map-get($grid-breakpoints, sm),
+			flex-basis: 50%,
+			max-width: 50%,
+		),
+		md: (
+			breakpoint: map-get($grid-breakpoints, md),
+			flex-basis: 33.3333%,
+			max-width: 33.3333%,
+		),
+		lg: (
+			breakpoint: map-get($grid-breakpoints, lg),
+			flex-basis: 25%,
+			max-width: 25%,
+		),
+	),
+	$card-page-item-asset
+);
 
 // Card Page Item User
 
 // base: min-width 0, sm min-width: 576px, lg: min-width: 992px
 
 $card-page-item-user: () !default;
-$card-page-item-user: map-deep-merge((
-	base: (
-		breakpoint: 0,
-		flex-basis: 50%,
-		max-width: 50%,
-		padding-left: $grid-gutter-width / 2,
-		padding-right: $grid-gutter-width / 2,
-	),
-	sm: (
-		breakpoint: map-get($grid-breakpoints, sm),
-		flex-basis: 33.33333%,
-		max-width: 33.33333%,
-		min-width: 200px,
-	),
-	lg: (
-		breakpoint: map-get($grid-breakpoints, lg),
-		flex-basis: 20%,
-		max-width: 20%,
-	),
-), $card-page-item-user);
+$card-page-item-user: map-deep-merge(
+	(
+		base: (
+			breakpoint: 0,
+			flex-basis: 50%,
+			max-width: 50%,
+			padding-left: $grid-gutter-width / 2,
+			padding-right: $grid-gutter-width / 2,
+		),
+		sm: (
+			breakpoint: map-get($grid-breakpoints, sm),
+			flex-basis: 33.33333%,
+			max-width: 33.33333%,
+			min-width: 200px,
+		),
+		lg: (
+			breakpoint: map-get($grid-breakpoints, lg),
+			flex-basis: 20%,
+			max-width: 20%,
+		),
+	),
+	$card-page-item-user
+);
 
 // Card Type Directory
 
 $card-type-directory: () !default;
-$card-type-directory: map-deep-merge((
-	sticker-font-size: 1.125rem,
-), $card-type-directory);
+$card-type-directory: map-deep-merge(
+	(
+		sticker-font-size: 1.125rem,
+	),
+	$card-type-directory
+);
 
 // Card Page Item Directory
 
 $card-page-item-directory: () !default;
-$card-page-item-directory: map-deep-merge((
-	$card-page-item-asset
-), $card-page-item-directory);
+$card-page-item-directory: map-deep-merge(
+	($card-page-item-asset),
+	$card-page-item-directory
+);
 
 // Card Type Template
 
 $card-type-template-after-highlight: () !default;
 
 $card-type-template-aspect-ratio: () !default;
-$card-type-template-aspect-ratio: map-deep-merge((
-	border-width: 0,
-	color: $gray-600,
-	horizontal: 16,
-	text-align: center,
-	vertical: 9,
-	lexicon-icon-height: auto,
-	lexicon-icon-width: 28%,
-), $card-type-template-aspect-ratio);
+$card-type-template-aspect-ratio: map-deep-merge(
+	(
+		border-width: 0,
+		color: $gray-600,
+		horizontal: 16,
+		text-align: center,
+		vertical: 9,
+		lexicon-icon-height: auto,
+		lexicon-icon-width: 28%,
+	),
+	$card-type-template-aspect-ratio
+);
 
 $card-type-template-aspect-ratio-item: () !default;
-$card-type-template-aspect-ratio-item: map-deep-merge((
-	width: 100.6%,
-), $card-type-template-aspect-ratio-item);
+$card-type-template-aspect-ratio-item: map-deep-merge(
+	(
+		width: 100.6%,
+	),
+	$card-type-template-aspect-ratio-item
+);
 
 $card-type-template-card-title: () !default;
-$card-type-template-card-title: map-deep-merge((
-	display: block,
-	margin-bottom: 0.5rem,
-), $card-type-template-card-title);
+$card-type-template-card-title: map-deep-merge(
+	(
+		display: block,
+		margin-bottom: 0.5rem,
+	),
+	$card-type-template-card-title
+);
 
 $card-type-template-card-text: () !default;
-$card-type-template-card-text: map-deep-merge((
-	display: block,
-), $card-type-template-card-text);
+$card-type-template-card-text: map-deep-merge(
+	(
+		display: block,
+	),
+	$card-type-template-card-text
+);
 
 $card-type-template: () !default;
-$card-type-template: map-deep-merge((
-	color: $gray-900,
-	hover-color: $gray-900,
-	after-highlight: $card-type-template-after-highlight,
-	aspect-ratio: $card-type-template-aspect-ratio,
-	aspect-ratio-item: $card-type-template-aspect-ratio-item,
-	card-title: $card-type-template-card-title,
-	card-text: $card-type-template-card-text,
-), $card-type-template);
+$card-type-template: map-deep-merge(
+	(
+		color: $gray-900,
+		hover-color: $gray-900,
+		after-highlight: $card-type-template-after-highlight,
+		aspect-ratio: $card-type-template-aspect-ratio,
+		aspect-ratio-item: $card-type-template-aspect-ratio-item,
+		card-title: $card-type-template-card-title,
+		card-text: $card-type-template-card-text,
+	),
+	$card-type-template
+);
 
 // Template Card
 
 $template-card-body: () !default;
-$template-card-body: map-deep-merge((
-	padding-top: 0,
-	text-align: center,
-), $template-card-body);
+$template-card-body: map-deep-merge(
+	(
+		padding-top: 0,
+		text-align: center,
+	),
+	$template-card-body
+);
 
 $template-card: () !default;
-$template-card: map-deep-merge((
-	card-body: $template-card-body,
-), $template-card);
+$template-card: map-deep-merge(
+	(
+		card-body: $template-card-body,
+	),
+	$template-card
+);
 
 // Template Card Horizontal
 
 $template-card-horizontal-sticker: () !default;
-$template-card-horizontal-sticker: map-deep-merge((
-	font-size: 1.25rem,
-), $template-card-horizontal-sticker);
+$template-card-horizontal-sticker: map-deep-merge(
+	(
+		font-size: 1.25rem,
+	),
+	$template-card-horizontal-sticker
+);
 
 $template-card-horizontal-card-row: () !default;
-$template-card-horizontal-card-row: map-deep-merge((
-	margin-left: -4px,
-	margin-right: -4px,
-	width: auto,
-	autofit-col-padding-left: 4px,
-	autofit-col-padding-right: 4px,
-), $template-card-horizontal-card-row);
+$template-card-horizontal-card-row: map-deep-merge(
+	(
+		margin-left: -4px,
+		margin-right: -4px,
+		width: auto,
+		autofit-col-padding-left: 4px,
+		autofit-col-padding-right: 4px,
+	),
+	$template-card-horizontal-card-row
+);
 
 $template-card-horizontal-card-title: () !default;
-$template-card-horizontal-card-title: map-deep-merge((
-	color: inherit,
-	margin-bottom: 0,
-), $template-card-horizontal-card-title);
+$template-card-horizontal-card-title: map-deep-merge(
+	(
+		color: inherit,
+		margin-bottom: 0,
+	),
+	$template-card-horizontal-card-title
+);
 
 $template-card-horizontal: () !default;
-$template-card-horizontal: map-deep-merge((
-	color: $gray-600,
-	hover-color: $gray-600,
-	sticker: $template-card-horizontal-sticker,
-	card-row: $template-card-horizontal-card-row,
-	card-title: $template-card-horizontal-card-title,
-), $template-card-horizontal);
\ No newline at end of file
+$template-card-horizontal: map-deep-merge(
+	(
+		color: $gray-600,
+		hover-color: $gray-600,
+		sticker: $template-card-horizontal-sticker,
+		card-row: $template-card-horizontal-card-row,
+		card-title: $template-card-horizontal-card-title,
+	),
+	$template-card-horizontal
+);
diff --git a/packages/clay-css/src/scss/variables/_clay-color.scss b/packages/clay-css/src/scss/variables/_clay-color.scss
index a93dbe2a5f..68f329f112 100644
--- a/packages/clay-css/src/scss/variables/_clay-color.scss
+++ b/packages/clay-css/src/scss/variables/_clay-color.scss
@@ -1,12 +1,15 @@
 // Clay Color Input Group Text (.clay-color > .input-group-item > .input-group-text)
 
 $clay-color-input-group-text: () !default;
-$clay-color-input-group-text: map-deep-merge((
-	bg: $white,
-	border-color: $input-border-color,
-	padding-left: 0,
-	padding-right: 0,
-), $clay-color-input-group-text);
+$clay-color-input-group-text: map-deep-merge(
+	(
+		bg: $white,
+		border-color: $input-border-color,
+		padding-left: 0,
+		padding-right: 0,
+	),
+	$clay-color-input-group-text
+);
 
 // Clay Color Input Group Input (.clay-color > .input-group-item > .form-control)
 
@@ -15,54 +18,69 @@ $clay-color-input-group-input: () !default;
 // Clay Color Input Group Inset Item Before (.clay-color > .input-group-item > .input-group-inset-item-before)
 
 $clay-color-input-group-inset-item-before: () !default;
-$clay-color-input-group-inset-item-before: map-deep-merge((
-	color: $gray-600,
-	font-size: inherit,
-	padding-left: $input-padding-x,
-	padding-right: 0.5rem,
-), $clay-color-input-group-inset-item-before);
+$clay-color-input-group-inset-item-before: map-deep-merge(
+	(
+		color: $gray-600,
+		font-size: inherit,
+		padding-left: $input-padding-x,
+		padding-right: 0.5rem,
+	),
+	$clay-color-input-group-inset-item-before
+);
 
 // Dropdown Menu
 
 $clay-color-dropdown-menu: () !default;
-$clay-color-dropdown-menu: map-deep-merge((
-	max-height: 394px,
-	max-width: none,
-	padding-bottom: 0.5rem,
-	padding-left: 1.5rem,
-	padding-right: 1.5rem,
-	padding-top: 1rem,
-	width: 272px,
-), $clay-color-dropdown-menu);
+$clay-color-dropdown-menu: map-deep-merge(
+	(
+		max-height: 394px,
+		max-width: none,
+		padding-bottom: 0.5rem,
+		padding-left: 1.5rem,
+		padding-right: 1.5rem,
+		padding-top: 1rem,
+		width: 272px,
+	),
+	$clay-color-dropdown-menu
+);
 
 // Dropdown Menu Form Group
 
 $clay-color-dropdown-menu-form-group: () !default;
-$clay-color-dropdown-menu-form-group: map-deep-merge((
-	margin-bottom: 1rem,
-), $clay-color-dropdown-menu-form-group);
+$clay-color-dropdown-menu-form-group: map-deep-merge(
+	(
+		margin-bottom: 1rem,
+	),
+	$clay-color-dropdown-menu-form-group
+);
 
 // Dropdown Menu Input (.clay-color-dropdown-menu .form-control)
 
 $clay-color-dropdown-menu-input: () !default;
-$clay-color-dropdown-menu-input: map-deep-merge((
-	font-size: 0.875rem,
-	height: 2rem,
-	padding-bottom: 0.25rem,
-	padding-left: 0.75rem,
-	padding-right: 0.75rem,
-	padding-top: 0.25rem,
-), $clay-color-dropdown-menu-input);
+$clay-color-dropdown-menu-input: map-deep-merge(
+	(
+		font-size: 0.875rem,
+		height: 2rem,
+		padding-bottom: 0.25rem,
+		padding-left: 0.75rem,
+		padding-right: 0.75rem,
+		padding-top: 0.25rem,
+	),
+	$clay-color-dropdown-menu-input
+);
 
 // Dropdown Menu Input Group Inset Item Before
 
 $clay-color-dropdown-menu-input-group-inset-item-before: () !default;
-$clay-color-dropdown-menu-input-group-inset-item-before: map-deep-merge((
-	color: $gray-600,
-	font-size: 0.875rem,
-	padding-left: $input-padding-x-sm,
-	padding-right: 0.5rem,
-), $clay-color-dropdown-menu-input-group-inset-item-before);
+$clay-color-dropdown-menu-input-group-inset-item-before: map-deep-merge(
+	(
+		color: $gray-600,
+		font-size: 0.875rem,
+		padding-left: $input-padding-x-sm,
+		padding-right: 0.5rem,
+	),
+	$clay-color-dropdown-menu-input-group-inset-item-before
+);
 
 // Dropdown Menu Close
 
@@ -71,118 +89,151 @@ $clay-color-dropdown-menu-close: () !default;
 // Dropdown Menu Component Action
 
 $clay-color-dropdown-menu-component-action: () !default;
-$clay-color-dropdown-menu-component-action: map-deep-merge((
-	hover-bg: transparent,
-	hover-color: $black,
-	focus-box-shadow: $btn-focus-box-shadow,
-	focus-color: $black,
-), $clay-color-dropdown-menu-component-action);
+$clay-color-dropdown-menu-component-action: map-deep-merge(
+	(
+		hover-bg: transparent,
+		hover-color: $black,
+		focus-box-shadow: $btn-focus-box-shadow,
+		focus-color: $black,
+	),
+	$clay-color-dropdown-menu-component-action
+);
 
 // Clay Color Swatch
 
 $clay-color-swatch: () !default;
-$clay-color-swatch: map-deep-merge((
-	display: flex,
-	flex-wrap: wrap,
-	margin-left: -0.5rem,
-	margin-right: -0.5rem,
-	margin-top: 0.5rem,
-), $clay-color-swatch);
+$clay-color-swatch: map-deep-merge(
+	(
+		display: flex,
+		flex-wrap: wrap,
+		margin-left: -0.5rem,
+		margin-right: -0.5rem,
+		margin-top: 0.5rem,
+	),
+	$clay-color-swatch
+);
 
 $clay-color-swatch-item: () !default;
-$clay-color-swatch-item: map-deep-merge((
-	display: flex,
-	flex-wrap: wrap,
-	justify-content: center,
-	padding-bottom: 1rem,
-	width: 16.66667%,
-), $clay-color-swatch-item);
+$clay-color-swatch-item: map-deep-merge(
+	(
+		display: flex,
+		flex-wrap: wrap,
+		justify-content: center,
+		padding-bottom: 1rem,
+		width: 16.66667%,
+	),
+	$clay-color-swatch-item
+);
 
 // Clay Color Btn
 
 $clay-color-btn: () !default;
-$clay-color-btn: map-deep-merge((
-	border-radius: 2px,
-	height: 1.5rem,
-	padding-bottom: 0,
-	padding-left: 0,
-	padding-right: 0,
-	padding-top: 0,
-	width: 1.5rem,
-), $clay-color-btn);
+$clay-color-btn: map-deep-merge(
+	(
+		border-radius: 2px,
+		height: 1.5rem,
+		padding-bottom: 0,
+		padding-left: 0,
+		padding-right: 0,
+		padding-top: 0,
+		width: 1.5rem,
+	),
+	$clay-color-btn
+);
 
 $clay-color-btn-bordered: () !default;
-$clay-color-btn-bordered: map-deep-merge((
-	border-color: $gray-300,
-), $clay-color-btn-bordered);
+$clay-color-btn-bordered: map-deep-merge(
+	(
+		border-color: $gray-300,
+	),
+	$clay-color-btn-bordered
+);
 
 // Clay Color Pointer
 
 $clay-color-pointer: () !default;
-$clay-color-pointer: map-deep-merge((
-	bg: transparent,
-	border-radius: 100px,
-	border-color: $white,
-	border-style: solid,
-	border-width: 2px,
-	height: 0.875rem,
-	padding-bottom: 0,
-	padding-left: 0,
-	padding-right: 0,
-	padding-top: 0,
-	position: absolute,
-	transition: box-shadow 0.15s ease-in-out,
-	width: 0.875rem,
-	focus-box-shadow: $btn-focus-box-shadow,
-	focus-outline: 0,
-), $clay-color-pointer);
+$clay-color-pointer: map-deep-merge(
+	(
+		bg: transparent,
+		border-radius: 100px,
+		border-color: $white,
+		border-style: solid,
+		border-width: 2px,
+		height: 0.875rem,
+		padding-bottom: 0,
+		padding-left: 0,
+		padding-right: 0,
+		padding-top: 0,
+		position: absolute,
+		transition: box-shadow 0.15s ease-in-out,
+		width: 0.875rem,
+		focus-box-shadow: $btn-focus-box-shadow,
+		focus-outline: 0,
+	),
+	$clay-color-pointer
+);
 
 // Clay Color Header
 
 $clay-color-header: () !default;
-$clay-color-header: map-deep-merge((
-	display: flex,
-	justify-content: space-between,
-	margin-bottom: 1rem,
-	margin-top: 0.5rem,
-	margin-right: -0.3125rem,
-), $clay-color-header);
+$clay-color-header: map-deep-merge(
+	(
+		display: flex,
+		justify-content: space-between,
+		margin-bottom: 1rem,
+		margin-top: 0.5rem,
+		margin-right: -0.3125rem,
+	),
+	$clay-color-header
+);
 
 // Clay Color Header Component Title
 
 $clay-color-header-component-title: () !default;
-$clay-color-header-component-title: map-deep-merge((
-	color: $gray-600,
-	display: inline-block,
-	font-size: 0.875rem,
-	font-weight: $font-weight-semi-bold,
-	max-width: calc(100% - 2rem),
-), $clay-color-header-component-title);
+$clay-color-header-component-title: map-deep-merge(
+	(
+		color: $gray-600,
+		display: inline-block,
+		font-size: 0.875rem,
+		font-weight: $font-weight-semi-bold,
+		max-width: calc(100% - 2rem),
+	),
+	$clay-color-header-component-title
+);
 
 // Clay Color Footer
 
 $clay-color-footer: () !default;
-$clay-color-footer: map-deep-merge((
-	margin-bottom: 1rem,
-), $clay-color-footer);
+$clay-color-footer: map-deep-merge(
+	(
+		margin-bottom: 1rem,
+	),
+	$clay-color-footer
+);
 
 // Clay Color Map
 
 $clay-color-map-group: () !default;
-$clay-color-map-group: map-deep-merge((
-	display: flex,
-	margin-top: 0.5rem,
-), $clay-color-map-group);
+$clay-color-map-group: map-deep-merge(
+	(
+		display: flex,
+		margin-top: 0.5rem,
+	),
+	$clay-color-map-group
+);
 
 $clay-color-map: () !default;
-$clay-color-map: map-deep-merge((
-	flex-shrink: 0,
-	height: 128px,
-	margin-bottom: 1rem,
-	margin-right: 1rem,
-	position: relative,
-	width: 144px,
-), $clay-color-map);
+$clay-color-map: map-deep-merge(
+	(
+		flex-shrink: 0,
+		height: 128px,
+		margin-bottom: 1rem,
+		margin-right: 1rem,
+		position: relative,
+		width: 144px,
+	),
+	$clay-color-map
+);
 
 $clay-color-map-hsb: () !default;
 
@@ -193,46 +244,61 @@ $clay-color-map-pointer: () !default;
 // Clay Color Map Values
 
 $clay-color-map-values: () !default;
-$clay-color-map-values: map-deep-merge((
-	flex-grow: 1,
-	flex-shrink: 1,
-	width: 1%,
-), $clay-color-map-values);
+$clay-color-map-values: map-deep-merge(
+	(
+		flex-grow: 1,
+		flex-shrink: 1,
+		width: 1%,
+	),
+	$clay-color-map-values
+);
 
 $clay-color-map-values-form-group: () !default;
 
 // Clay Color Map Values (.clay-color-map-values .form-control)
 
 $clay-color-map-values-input: () !default;
-$clay-color-map-values-input: map-deep-merge((
-	padding-left: 0,
-	padding-right: 10%,
-	text-align: right,
-), $clay-color-map-values-input);
+$clay-color-map-values-input: map-deep-merge(
+	(
+		padding-left: 0,
+		padding-right: 10%,
+		text-align: right,
+	),
+	$clay-color-map-values-input
+);
 
 // Clay Color Map Values Input Group Inset Item Before (.clay-color-map-values .input-group-inset-item-before)
 
 $clay-color-map-values-input-group-inset-item-before: () !default;
-$clay-color-map-values-input-group-inset-item-before: map-deep-merge((
-	font-weight: $font-weight-semi-bold,
-	padding-left: 10%,
-	padding-right: 0,
-	min-width: 1.125rem,
-), $clay-color-map-values-input-group-inset-item-before);
+$clay-color-map-values-input-group-inset-item-before: map-deep-merge(
+	(
+		font-weight: $font-weight-semi-bold,
+		padding-left: 10%,
+		padding-right: 0,
+		min-width: 1.125rem,
+	),
+	$clay-color-map-values-input-group-inset-item-before
+);
 
 // Clay Color Range
 
 $clay-color-range: () !default;
-$clay-color-range: map-deep-merge((
-	border-radius: 100px,
-	height: 0.5rem,
-	margin-bottom: 1.25rem,
-	margin-top: 0.25rem,
-	position: relative,
-), $clay-color-range);
+$clay-color-range: map-deep-merge(
+	(
+		border-radius: 100px,
+		height: 0.5rem,
+		margin-bottom: 1.25rem,
+		margin-top: 0.25rem,
+		position: relative,
+	),
+	$clay-color-range
+);
 
 $clay-color-range-pointer: () !default;
-$clay-color-range-pointer: map-deep-merge((
-	margin-top: -7px,
-	top: 50%,
-), $clay-color-range-pointer);
\ No newline at end of file
+$clay-color-range-pointer: map-deep-merge(
+	(
+		margin-top: -7px,
+		top: 50%,
+	),
+	$clay-color-range-pointer
+);
diff --git a/packages/clay-css/src/scss/variables/_custom-forms.scss b/packages/clay-css/src/scss/variables/_custom-forms.scss
index 5a10009dad..787b6c5044 100644
--- a/packages/clay-css/src/scss/variables/_custom-forms.scss
+++ b/packages/clay-css/src/scss/variables/_custom-forms.scss
@@ -52,15 +52,19 @@ $custom-control-margin-top: null !default;
 
 /// @deprecated after of v3.5.0 use the Sass map `$custom-control` instead
 
-$custom-control-min-height: $custom-control-indicator-size + ($custom-control-indicator-position-top * 2) !default;
+$custom-control-min-height: $custom-control-indicator-size +
+	($custom-control-indicator-position-top * 2) !default;
 
 $custom-control: () !default;
-$custom-control: map-deep-merge((
-	margin-bottom: $custom-control-margin-bottom,
-	margin-top: $custom-control-margin-top,
-	min-height: $custom-control-min-height,
-	text-align: left,
-), $custom-control);
+$custom-control: map-deep-merge(
+	(
+		margin-bottom: $custom-control-margin-bottom,
+		margin-top: $custom-control-margin-top,
+		min-height: $custom-control-min-height,
+		text-align: left,
+	),
+	$custom-control
+);
 
 // Custom Description
 
@@ -93,35 +97,50 @@ $custom-control-description-disabled-cursor: $disabled-cursor !default;
 $custom-control-description-small-font-size: null !default;
 
 $custom-control-label: () !default;
-$custom-control-label: map-deep-merge((
-	cursor: $custom-control-description-cursor,
-	font-size: $custom-control-description-font-size,
-	font-weight: $custom-control-description-font-weight,
-	line-height: $custom-control-description-line-height,
-	position: static,
-), $custom-control-label);
+$custom-control-label: map-deep-merge(
+	(
+		cursor: $custom-control-description-cursor,
+		font-size: $custom-control-description-font-size,
+		font-weight: $custom-control-description-font-weight,
+		line-height: $custom-control-description-line-height,
+		position: static,
+	),
+	$custom-control-label
+);
 
 $custom-control-label-disabled: () !default;
-$custom-control-label-disabled: map-deep-merge((
-	cursor: $custom-control-description-disabled-cursor,
-), $custom-control-label-disabled);
+$custom-control-label-disabled: map-deep-merge(
+	(
+		cursor: $custom-control-description-disabled-cursor,
+	),
+	$custom-control-label-disabled
+);
 
 $custom-control-label-text: () !default;
-$custom-control-label-text: map-deep-merge((
-	padding-left: $custom-control-description-padding-left,
-), $custom-control-label-text);
+$custom-control-label-text: map-deep-merge(
+	(
+		padding-left: $custom-control-description-padding-left,
+	),
+	$custom-control-label-text
+);
 
 $custom-control-label-text-small: () !default;
-$custom-control-label-text-small: map-deep-merge((
-	font-size: $custom-control-description-small-font-size,
-), $custom-control-label-text-small);
+$custom-control-label-text-small: map-deep-merge(
+	(
+		font-size: $custom-control-description-small-font-size,
+	),
+	$custom-control-label-text-small
+);
 
 // Custom Control Primary
 
 $custom-control-primary-label-text: () !default;
-$custom-control-primary-label-text: map-deep-merge((
-	font-weight: $font-weight-semi-bold,
-), $custom-control-primary-label-text);
+$custom-control-primary-label-text: map-deep-merge(
+	(
+		font-weight: $font-weight-semi-bold,
+	),
+	$custom-control-primary-label-text
+);
 
 // Custom Checkbox
 
@@ -137,4 +156,4 @@ $custom-radio-indicator-disabled-border-color: null !default;
 /// @deprecated as of v2.2.1 use `$custom-radio-indicator-checked-disabled-border-color` instead
 
 $custom-radio-indicator-disabled-checked-border-color: null !default;
-$custom-radio-indicator-checked-disabled-border-color: $custom-radio-indicator-disabled-checked-border-color !default;
\ No newline at end of file
+$custom-radio-indicator-checked-disabled-border-color: $custom-radio-indicator-disabled-checked-border-color !default;
diff --git a/packages/clay-css/src/scss/variables/_date-picker.scss b/packages/clay-css/src/scss/variables/_date-picker.scss
index 985dc26f05..c55e7cd4d9 100644
--- a/packages/clay-css/src/scss/variables/_date-picker.scss
+++ b/packages/clay-css/src/scss/variables/_date-picker.scss
@@ -1,42 +1,54 @@
 // Date Picker Dropdown Menu
 
 $date-picker-dropdown-menu: () !default;
-$date-picker-dropdown-menu: map-deep-merge((
-	max-height: none,
-	max-width: 370px,
-	padding-bottom: 0,
-	padding-left: 0,
-	padding-right: 0,
-	padding-top: 0,
-	width: 100%,
-), $date-picker-dropdown-menu);
+$date-picker-dropdown-menu: map-deep-merge(
+	(
+		max-height: none,
+		max-width: 370px,
+		padding-bottom: 0,
+		padding-left: 0,
+		padding-right: 0,
+		padding-top: 0,
+		width: 100%,
+	),
+	$date-picker-dropdown-menu
+);
 
 // Date Picker Nav
 
 $date-picker-nav-row: () !default;
-$date-picker-nav-row: map-deep-merge((
-	display: flex,
-	margin-left: -0.25rem,
-	margin-right: -0.25rem,
-), $date-picker-nav-row);
+$date-picker-nav-row: map-deep-merge(
+	(
+		display: flex,
+		margin-left: -0.25rem,
+		margin-right: -0.25rem,
+	),
+	$date-picker-nav-row
+);
 
 $date-picker-nav-btn: () !default;
-$date-picker-nav-btn: map-deep-merge((
-	color: $gray-600,
-	transition: $btn-transition,
-	hover-bg: $gray-200,
-	focus-box-shadow: $input-btn-focus-box-shadow,
-	disabled-bg: transparent,
-	disabled-box-shadow: none,
-	disabled-color: $gray-600,
-	disabled-opacity: $btn-disabled-opacity,
-), $date-picker-nav-btn);
+$date-picker-nav-btn: map-deep-merge(
+	(
+		color: $gray-600,
+		transition: $btn-transition,
+		hover-bg: $gray-200,
+		focus-box-shadow: $input-btn-focus-box-shadow,
+		disabled-bg: transparent,
+		disabled-box-shadow: none,
+		disabled-color: $gray-600,
+		disabled-opacity: $btn-disabled-opacity,
+	),
+	$date-picker-nav-btn
+);
 
 $date-picker-nav-btn-monospaced: () !default;
-$date-picker-nav-btn-monospaced: map-deep-merge((
-	margin-bottom: 0,
-	margin-top: 0,
-), $date-picker-nav-btn-monospaced);
+$date-picker-nav-btn-monospaced: map-deep-merge(
+	(
+		margin-bottom: 0,
+		margin-top: 0,
+	),
+	$date-picker-nav-btn-monospaced
+);
 
 $date-picker-nav-select: () !default;
 $date-picker-nav-select: map-deep-merge((), $date-picker-nav-select);
@@ -44,125 +56,161 @@ $date-picker-nav-select: map-deep-merge((), $date-picker-nav-select);
 // Date Picker Row
 
 $date-picker-row: () !default;
-$date-picker-row: map-deep-merge((
-	display: flex,
-	justify-content: space-between,
-	margin-bottom: 0.5rem,
-	margin-top: 0.5rem,
-), $date-picker-row);
+$date-picker-row: map-deep-merge(
+	(
+		display: flex,
+		justify-content: space-between,
+		margin-bottom: 0.5rem,
+		margin-top: 0.5rem,
+	),
+	$date-picker-row
+);
 
 $date-picker-days-row: () !default;
-$date-picker-days-row: map-deep-merge((
-	margin-bottom: 1rem,
-	margin-top: 0,
-), $date-picker-days-row);
+$date-picker-days-row: map-deep-merge(
+	(
+		margin-bottom: 1rem,
+		margin-top: 0,
+	),
+	$date-picker-days-row
+);
 
 $date-picker-date-row: () !default;
 
 // Date Picker Day
 
 $date-picker-day: () !default;
-$date-picker-day: map-deep-merge((
-	height: 1.3125rem,
-), $date-picker-day);
+$date-picker-day: map-deep-merge(
+	(
+		height: 1.3125rem,
+	),
+	$date-picker-day
+);
 
 // Date Picker Calendar
 
 $date-picker-calendar-container: () !default;
-$date-picker-calendar-container: map-deep-merge((
-	float: left,
-	min-width: 100%,
-), $date-picker-calendar-container);
+$date-picker-calendar-container: map-deep-merge(
+	(
+		float: left,
+		min-width: 100%,
+	),
+	$date-picker-calendar-container
+);
 
 $date-picker-calendar-header-container: () !default;
-$date-picker-calendar-header-container: map-deep-merge((
-	padding-bottom: 1rem,
-	padding-left: 1rem,
-	padding-right: 1rem,
-	padding-top: 1rem,
-), $date-picker-calendar-header-container);
+$date-picker-calendar-header-container: map-deep-merge(
+	(
+		padding-bottom: 1rem,
+		padding-left: 1rem,
+		padding-right: 1rem,
+		padding-top: 1rem,
+	),
+	$date-picker-calendar-header-container
+);
 
 $date-picker-calendar-body-container: () !default;
-$date-picker-calendar-body-container: map-deep-merge((
-	padding-left: 1rem,
-	padding-right: 1rem,
-	padding-bottom: 0.5rem,
-), $date-picker-calendar-body-container);
+$date-picker-calendar-body-container: map-deep-merge(
+	(
+		padding-left: 1rem,
+		padding-right: 1rem,
+		padding-bottom: 0.5rem,
+	),
+	$date-picker-calendar-body-container
+);
 
 $date-picker-calendar-footer-container: () !default;
-$date-picker-calendar-footer-container: map-deep-merge((
-	border-color: $gray-400,
-	border-style: solid,
-	border-width: 1px 0 0 0,
-	padding-bottom: 1rem,
-	padding-left: 1.5rem,
-	padding-right: 1.5rem,
-	padding-top: 1rem,
-), $date-picker-calendar-footer-container);
+$date-picker-calendar-footer-container: map-deep-merge(
+	(
+		border-color: $gray-400,
+		border-style: solid,
+		border-width: 1px 0 0 0,
+		padding-bottom: 1rem,
+		padding-left: 1.5rem,
+		padding-right: 1.5rem,
+		padding-top: 1rem,
+	),
+	$date-picker-calendar-footer-container
+);
 
 // Date Picker Calendar Item
 
 $date-picker-calendar-item: () !default;
-$date-picker-calendar-item: map-deep-merge((
-	align-items: center,
-	bg: transparent,
-	border-width: 0,
-	cursor: $link-cursor,
-	disabled-cursor: $disabled-cursor,
-	display: inline-flex,
-	flex-shrink: 0,
-	font-weight: $font-weight-semi-bold,
-	height: 2rem,
-	justify-content: center,
-	line-height: 1,
-	margin-left: 0.5rem,
-	margin-right: 0.5rem,
-	padding-bottom: 0,
-	padding-left: 0,
-	padding-right: 0,
-	padding-top: 0,
-	transition: $btn-transition,
-	user-select: none,
-	vertical-align: middle,
-	white-space: nowrap,
-	width: 2rem,
-), $date-picker-calendar-item);
+$date-picker-calendar-item: map-deep-merge(
+	(
+		align-items: center,
+		bg: transparent,
+		border-width: 0,
+		cursor: $link-cursor,
+		disabled-cursor: $disabled-cursor,
+		display: inline-flex,
+		flex-shrink: 0,
+		font-weight: $font-weight-semi-bold,
+		height: 2rem,
+		justify-content: center,
+		line-height: 1,
+		margin-left: 0.5rem,
+		margin-right: 0.5rem,
+		padding-bottom: 0,
+		padding-left: 0,
+		padding-right: 0,
+		padding-top: 0,
+		transition: $btn-transition,
+		user-select: none,
+		vertical-align: middle,
+		white-space: nowrap,
+		width: 2rem,
+	),
+	$date-picker-calendar-item
+);
 
 $date-picker-date: () !default;
-$date-picker-date: map-deep-merge((
-	border-radius: 100px,
-	color: $gray-600,
-	hover-bg: $gray-200,
-	focus-box-shadow: $input-btn-focus-box-shadow,
-	focus-outline: 0,
-	active-bg: $component-active-bg,
-	active-color: $component-active-color,
-	disabled-bg: transparent,
-	disabled-box-shadow: none,
-	disabled-opacity: $btn-disabled-opacity,
-), $date-picker-date);
+$date-picker-date: map-deep-merge(
+	(
+		border-radius: 100px,
+		color: $gray-600,
+		hover-bg: $gray-200,
+		focus-box-shadow: $input-btn-focus-box-shadow,
+		focus-outline: 0,
+		active-bg: $component-active-bg,
+		active-color: $component-active-color,
+		disabled-bg: transparent,
+		disabled-box-shadow: none,
+		disabled-opacity: $btn-disabled-opacity,
+	),
+	$date-picker-date
+);
 
 $date-picker-previous-month-date: () !default;
-$date-picker-previous-month-date: map-deep-merge((
-	opacity: 0.65,
-	focus-opacity: 1,
-	active-opacity: 1,
-), $date-picker-previous-month-date);
+$date-picker-previous-month-date: map-deep-merge(
+	(
+		opacity: 0.65,
+		focus-opacity: 1,
+		active-opacity: 1,
+	),
+	$date-picker-previous-month-date
+);
 
 $date-picker-next-month-date: () !default;
-$date-picker-next-month-date: map-deep-merge((
-	opacity: 0.65,
-	focus-opacity: 1,
-	active-opacity: 1,
-), $date-picker-next-month-date);
+$date-picker-next-month-date: map-deep-merge(
+	(
+		opacity: 0.65,
+		focus-opacity: 1,
+		active-opacity: 1,
+	),
+	$date-picker-next-month-date
+);
 
 // Date Picker Input Group
 
 $date-picker-input-group-text: () !default;
-$date-picker-input-group-text: map-deep-merge((
-	bg: transparent,
-	border-color: transparent,
-	min-width: 2rem,
-	padding-left: 0.25rem,
-	padding-right: 0.25rem,
-), $date-picker-input-group-text);
\ No newline at end of file
+$date-picker-input-group-text: map-deep-merge(
+	(
+		bg: transparent,
+		border-color: transparent,
+		min-width: 2rem,
+		padding-left: 0.25rem,
+		padding-right: 0.25rem,
+	),
+	$date-picker-input-group-text
+);
diff --git a/packages/clay-css/src/scss/variables/_drilldown.scss b/packages/clay-css/src/scss/variables/_drilldown.scss
index 5000360841..2ed597ab7c 100644
--- a/packages/clay-css/src/scss/variables/_drilldown.scss
+++ b/packages/clay-css/src/scss/variables/_drilldown.scss
@@ -5,4 +5,4 @@ $drilldown-width: $dropdown-max-width !default;
 
 $drilldown-inline-scroller-max-height: 358px !default;
 
-$drilldown-item-header: () !default;
\ No newline at end of file
+$drilldown-item-header: () !default;
diff --git a/packages/clay-css/src/scss/variables/_dropdowns.scss b/packages/clay-css/src/scss/variables/_dropdowns.scss
index 5f6631b392..b9bff8be77 100644
--- a/packages/clay-css/src/scss/variables/_dropdowns.scss
+++ b/packages/clay-css/src/scss/variables/_dropdowns.scss
@@ -46,39 +46,45 @@ $dropdown-item-indicator-size: 1rem !default;
 $dropdown-item-indicator-spacer-x: 1rem !default;
 
 $dropdown-item-base: () !default;
-$dropdown-item-base: map-deep-merge((
-	border-radius: 0,
-	display: block,
-	overflow: hidden,
-	padding-bottom: $dropdown-item-padding-y,
-	padding-left: $dropdown-item-padding-x,
-	padding-right: $dropdown-item-padding-x,
-	padding-top: $dropdown-item-padding-y,
-	position: relative,
-	transition: none,
-	white-space: normal,
-	word-wrap: break-word,
-	hover-text-decoration: none,
-	active-color: $dropdown-link-active-color,
-	active-class-font-weight: $dropdown-link-active-font-weight,
-	disabled-color: $dropdown-link-disabled-color,
-	disabled-cursor: $dropdown-item-disabled-cursor,
-	disabled-opacity: 1,
-	disabled-outline: 0,
-	disabled-pointer-events: auto,
-	disabled-active-pointer-events: none,
-	disabled-c-kbd-inline: (
-		color: $dropdown-link-disabled-color,
+$dropdown-item-base: map-deep-merge(
+	(
+		border-radius: 0,
+		display: block,
+		overflow: hidden,
+		padding-bottom: $dropdown-item-padding-y,
+		padding-left: $dropdown-item-padding-x,
+		padding-right: $dropdown-item-padding-x,
+		padding-top: $dropdown-item-padding-y,
+		position: relative,
+		transition: none,
+		white-space: normal,
+		word-wrap: break-word,
+		hover-text-decoration: none,
+		active-color: $dropdown-link-active-color,
+		active-class-font-weight: $dropdown-link-active-font-weight,
+		disabled-color: $dropdown-link-disabled-color,
+		disabled-cursor: $dropdown-item-disabled-cursor,
+		disabled-opacity: 1,
+		disabled-outline: 0,
+		disabled-pointer-events: auto,
+		disabled-active-pointer-events: none,
+		disabled-c-kbd-inline: (
+			color: $dropdown-link-disabled-color,
+		),
+		c-kbd-inline: (
+			line-height: $dropdown-font-size * $line-height-base,
+		),
 	),
-	c-kbd-inline: (
-		line-height: $dropdown-font-size * $line-height-base,
-	),
-), $dropdown-item-base);
+	$dropdown-item-base
+);
 
 $dropdown-section-custom-control: () !default;
-$dropdown-section-custom-control: map-deep-merge((
-	margin-bottom: 0,
-), $dropdown-section-custom-control);
+$dropdown-section-custom-control: map-deep-merge(
+	(
+		margin-bottom: 0,
+	),
+	$dropdown-section-custom-control
+);
 
 $dropdown-section-custom-control-label: () !default;
 
@@ -89,11 +95,14 @@ $dropdown-section-active-custom-control-label: () !default;
 // Autocomplete Dropdown Menu
 
 $autocomplete-dropdown-menu: () !default;
-$autocomplete-dropdown-menu: map-deep-merge((
-	max-height: calc(9rem + 2px),
-	max-width: none,
-	width: 100%,
-), $autocomplete-dropdown-menu);
+$autocomplete-dropdown-menu: map-deep-merge(
+	(
+		max-height: calc(9rem + 2px),
+		max-width: none,
+		width: 100%,
+	),
+	$autocomplete-dropdown-menu
+);
 
 // Dropdown Action
 
@@ -110,4 +119,4 @@ $dropdown-alert-font-size: null !default;
 $dropdown-alert-line-height: normal !default;
 $dropdown-alert-margin: ($spacer / 2) !default;
 $dropdown-alert-padding-x: $dropdown-header-padding-x !default;
-$dropdown-alert-padding-y: $dropdown-header-padding-y !default;
\ No newline at end of file
+$dropdown-alert-padding-y: $dropdown-header-padding-y !default;
diff --git a/packages/clay-css/src/scss/variables/_dual-listbox.scss b/packages/clay-css/src/scss/variables/_dual-listbox.scss
index af5c9c0744..5e124dd8fa 100644
--- a/packages/clay-css/src/scss/variables/_dual-listbox.scss
+++ b/packages/clay-css/src/scss/variables/_dual-listbox.scss
@@ -1,47 +1,71 @@
 $clay-dual-listbox: () !default;
-$clay-dual-listbox: map-deep-merge((
-	display: flex,
-	flex-direction: row,
-), $clay-dual-listbox);
+$clay-dual-listbox: map-deep-merge(
+	(
+		display: flex,
+		flex-direction: row,
+	),
+	$clay-dual-listbox
+);
 
 $clay-dual-listbox-label: () !default;
-$clay-dual-listbox-label: map-deep-merge((
-	margin-bottom: 1rem,
-), $clay-dual-listbox-label);
+$clay-dual-listbox-label: map-deep-merge(
+	(
+		margin-bottom: 1rem,
+	),
+	$clay-dual-listbox-label
+);
 
 $clay-dual-listbox-clay-reorder: () !default;
-$clay-dual-listbox-clay-reorder: map-deep-merge((
-	display: flex,
-	flex-direction: column,
-	flex-grow: 1,
-), $clay-dual-listbox-clay-reorder);
+$clay-dual-listbox-clay-reorder: map-deep-merge(
+	(
+		display: flex,
+		flex-direction: column,
+		flex-grow: 1,
+	),
+	$clay-dual-listbox-clay-reorder
+);
 
 $clay-dual-listbox-item: () !default;
-$clay-dual-listbox-item: map-deep-merge((
-	display: flex,
-	flex-direction: column,
-	margin-right: 0.25rem,
-), $clay-dual-listbox-item);
+$clay-dual-listbox-item: map-deep-merge(
+	(
+		display: flex,
+		flex-direction: column,
+		margin-right: 0.25rem,
+	),
+	$clay-dual-listbox-item
+);
 
 $clay-dual-listbox-item-sm-up: () !default;
-$clay-dual-listbox-item-sm-up: map-deep-merge((
-	margin-right: 1.5rem,
-), $clay-dual-listbox-item-sm-up);
+$clay-dual-listbox-item-sm-up: map-deep-merge(
+	(
+		margin-right: 1.5rem,
+	),
+	$clay-dual-listbox-item-sm-up
+);
 
 $clay-dual-listbox-item-last-child: () !default;
-$clay-dual-listbox-item-last-child: map-deep-merge((
-	margin-right: 0,
-), $clay-dual-listbox-item-last-child);
+$clay-dual-listbox-item-last-child: map-deep-merge(
+	(
+		margin-right: 0,
+	),
+	$clay-dual-listbox-item-last-child
+);
 
 $clay-dual-listbox-item-expand: () !default;
-$clay-dual-listbox-item-expand: map-deep-merge((
-	flex-grow: 1,
-	width: 3rem,
-	word-wrap: break-word,
-), $clay-dual-listbox-item-expand);
+$clay-dual-listbox-item-expand: map-deep-merge(
+	(
+		flex-grow: 1,
+		width: 3rem,
+		word-wrap: break-word,
+	),
+	$clay-dual-listbox-item-expand
+);
 
 $clay-dual-listbox-actions: () !default;
-$clay-dual-listbox-actions: map-deep-merge((
-	align-self: center,
-	margin-top: calc(21px + 1rem),
-), $clay-dual-listbox-actions);
+$clay-dual-listbox-actions: map-deep-merge(
+	(
+		align-self: center,
+		margin-top: calc(21px + 1rem),
+	),
+	$clay-dual-listbox-actions
+);
diff --git a/packages/clay-css/src/scss/variables/_empty-state.scss b/packages/clay-css/src/scss/variables/_empty-state.scss
index 9e4d06dcdb..ea2acd0915 100644
--- a/packages/clay-css/src/scss/variables/_empty-state.scss
+++ b/packages/clay-css/src/scss/variables/_empty-state.scss
@@ -1,57 +1,75 @@
 $c-empty-state: () !default;
 
 $c-empty-state-animation: () !default;
-$c-empty-state-animation: map-deep-merge((
-	align-items: center,
-	display: flex,
-	flex-direction: column,
-	margin: 5rem auto 1.5rem,
-	max-width: 340px,
-	text-align: center,
-), $c-empty-state-animation);
+$c-empty-state-animation: map-deep-merge(
+	(
+		align-items: center,
+		display: flex,
+		flex-direction: column,
+		margin: 5rem auto 1.5rem,
+		max-width: 340px,
+		text-align: center,
+	),
+	$c-empty-state-animation
+);
 
 $c-empty-state-image: () !default;
-$c-empty-state-image: map-deep-merge((
-	margin-bottom: -0.5rem,
-	max-width: 250px,
-	width: 100%,
-	word-wrap: break-word,
-), $c-empty-state-image);
+$c-empty-state-image: map-deep-merge(
+	(
+		margin-bottom: -0.5rem,
+		max-width: 250px,
+		width: 100%,
+		word-wrap: break-word,
+	),
+	$c-empty-state-image
+);
 
 $c-empty-state-aspect-ratio: () !default;
-$c-empty-state-aspect-ratio: map-deep-merge((
-	background-repeat: no-repeat,
-	background-position: center,
-	background-size: 100%,
-	display: block,
-	padding-bottom: 100%,
-	position: relative,
-	width: 100%,
-), $c-empty-state-aspect-ratio);
+$c-empty-state-aspect-ratio: map-deep-merge(
+	(
+		background-repeat: no-repeat,
+		background-position: center,
+		background-size: 100%,
+		display: block,
+		padding-bottom: 100%,
+		position: relative,
+		width: 100%,
+	),
+	$c-empty-state-aspect-ratio
+);
 
 $c-empty-state-title: () !default;
-$c-empty-state-title: map-deep-merge((
-	font-size: 1.25rem,
-	font-weight: $font-weight-semi-bold,
-	line-height: $headings-line-height,
-	margin-bottom: 0,
-	margin-top: 2.5rem,
-	max-width: 100%,
-	word-wrap: break-word,
-), $c-empty-state-title);
+$c-empty-state-title: map-deep-merge(
+	(
+		font-size: 1.25rem,
+		font-weight: $font-weight-semi-bold,
+		line-height: $headings-line-height,
+		margin-bottom: 0,
+		margin-top: 2.5rem,
+		max-width: 100%,
+		word-wrap: break-word,
+	),
+	$c-empty-state-title
+);
 
 $c-empty-state-text: () !default;
-$c-empty-state-text: map-deep-merge((
-	color: $secondary,
-	margin-bottom: 0,
-	margin-top: 0.5rem,
-	max-width: 100%,
-	word-wrap: break-word,
-), $c-empty-state-text);
+$c-empty-state-text: map-deep-merge(
+	(
+		color: $secondary,
+		margin-bottom: 0,
+		margin-top: 0.5rem,
+		max-width: 100%,
+		word-wrap: break-word,
+	),
+	$c-empty-state-text
+);
 
 $c-empty-state-footer: () !default;
-$c-empty-state-footer: map-deep-merge((
-	margin-top: 1rem,
-	max-width: 100%,
-	word-wrap: break-word,
-), $c-empty-state-footer);
+$c-empty-state-footer: map-deep-merge(
+	(
+		margin-top: 1rem,
+		max-width: 100%,
+		word-wrap: break-word,
+	),
+	$c-empty-state-footer
+);
diff --git a/packages/clay-css/src/scss/variables/_forms.scss b/packages/clay-css/src/scss/variables/_forms.scss
index ef333f6c36..d915a9dbb9 100644
--- a/packages/clay-css/src/scss/variables/_forms.scss
+++ b/packages/clay-css/src/scss/variables/_forms.scss
@@ -74,23 +74,29 @@ $input-readonly-focus-border-color: null !default;
 $input-readonly-focus-color: null !default;
 
 $input-readonly: () !default;
-$input-readonly: map-deep-merge((
-	bg: $input-readonly-bg,
-	border-color: $input-readonly-border-color,
-	color: $input-readonly-color,
-	cursor: $input-readonly-cursor,
-	focus-bg: $input-readonly-focus-bg,
-	focus-border-color: $input-readonly-focus-border-color,
-	focus-color: $input-readonly-focus-color,
-), $input-readonly);
+$input-readonly: map-deep-merge(
+	(
+		bg: $input-readonly-bg,
+		border-color: $input-readonly-border-color,
+		color: $input-readonly-color,
+		cursor: $input-readonly-cursor,
+		focus-bg: $input-readonly-focus-bg,
+		focus-border-color: $input-readonly-focus-border-color,
+		focus-color: $input-readonly-focus-color,
+	),
+	$input-readonly
+);
 
 $input-plaintext-readonly: () !default;
-$input-plaintext-readonly: map-deep-merge((
-	border-radius: $input-border-radius,
-	outline: 0,
-	transition: $input-transition,
-	focus-box-shadow: $input-focus-box-shadow,
-), $input-plaintext-readonly);
+$input-plaintext-readonly: map-deep-merge(
+	(
+		border-radius: $input-border-radius,
+		outline: 0,
+		transition: $input-transition,
+		focus-box-shadow: $input-focus-box-shadow,
+	),
+	$input-plaintext-readonly
+);
 
 $input-textarea-height: 150px !default;
 $input-textarea-height-lg: 190px !default;
@@ -99,80 +105,113 @@ $input-textarea-height-sm: 120px !default;
 // Form Control Label (Labels inside Form Control Tag Group)
 
 $form-control-label-size: () !default;
-$form-control-label-size: map-deep-merge((
-	border-width: 0.0625rem,
-	height: 1.25rem,
-	margin-bottom: 0.25rem,
-	margin-right: 0.5rem,
-	margin-top: 0.25rem,
-), $form-control-label-size);
+$form-control-label-size: map-deep-merge(
+	(
+		border-width: 0.0625rem,
+		height: 1.25rem,
+		margin-bottom: 0.25rem,
+		margin-right: 0.5rem,
+		margin-top: 0.25rem,
+	),
+	$form-control-label-size
+);
 
 // Form Control Tag Group
 
-$form-control-tag-group-padding-y: ($input-height - $input-border-bottom-width - $input-border-top-width - map-get($form-control-label-size, height) - (map-get($form-control-label-size, margin-bottom)) - (map-get($form-control-label-size, margin-top))) / 2 !default;
+$form-control-tag-group-padding-y: (
+		$input-height - $input-border-bottom-width - $input-border-top-width -
+			map-get($form-control-label-size, height) -
+			(map-get($form-control-label-size, margin-bottom)) -
+			(map-get($form-control-label-size, margin-top))
+	) / 2 !default;
 
 $form-control-inset-min-height: $input-font-size * $input-line-height !default;
-$form-control-inset-margin-y: ($input-height - $input-border-bottom-width - $input-border-top-width - ($form-control-tag-group-padding-y * 2) - $form-control-inset-min-height) / 2 !default;
+$form-control-inset-margin-y: (
+		$input-height - $input-border-bottom-width - $input-border-top-width -
+			($form-control-tag-group-padding-y * 2) -
+			$form-control-inset-min-height
+	) / 2 !default;
 
 $form-control-tag-group: () !default;
-$form-control-tag-group: map-deep-merge((
-	align-items: center,
-	display: flex,
-	flex-wrap: wrap,
-	height: auto,
-	padding-bottom: $form-control-tag-group-padding-y,
-	padding-top: $form-control-tag-group-padding-y,
-), $form-control-tag-group);
+$form-control-tag-group: map-deep-merge(
+	(
+		align-items: center,
+		display: flex,
+		flex-wrap: wrap,
+		height: auto,
+		padding-bottom: $form-control-tag-group-padding-y,
+		padding-top: $form-control-tag-group-padding-y,
+	),
+	$form-control-tag-group
+);
 
 $form-control-tag-group-autofit-row: () !default;
-$form-control-tag-group-autofit-row: map-deep-merge((
+$form-control-tag-group-autofit-row: map-deep-merge(
+	(
 		align-items: center,
 		flex-grow: 1,
 		margin-left: -0.5rem,
 		margin-right: -0.5rem,
 		width: auto,
-), $form-control-tag-group-autofit-row);
+	),
+	$form-control-tag-group-autofit-row
+);
 
 $form-control-tag-group-autofit-col: () !default;
-$form-control-tag-group-autofit-col: map-deep-merge((
-	padding-left: 0.5rem,
-	padding-right: 0.5rem,
-), $form-control-tag-group-autofit-col);
+$form-control-tag-group-autofit-col: map-deep-merge(
+	(
+		padding-left: 0.5rem,
+		padding-right: 0.5rem,
+	),
+	$form-control-tag-group-autofit-col
+);
 
 $form-control-tag-group-input-group-item: () !default;
-$form-control-tag-group-input-group-item: map-deep-merge((
-	align-items: flex-start,
-), $form-control-tag-group-input-group-item);
+$form-control-tag-group-input-group-item: map-deep-merge(
+	(
+		align-items: flex-start,
+	),
+	$form-control-tag-group-input-group-item
+);
 
 $form-control-tag-group-inline-item: () !default;
-$form-control-tag-group-inline-item: map-deep-merge((
-	height: $form-control-inset-min-height,
-	margin-bottom: $form-control-inset-margin-y,
-	margin-top: $form-control-inset-margin-y,
-), $form-control-tag-group-inline-item);
+$form-control-tag-group-inline-item: map-deep-merge(
+	(
+		height: $form-control-inset-min-height,
+		margin-bottom: $form-control-inset-margin-y,
+		margin-top: $form-control-inset-margin-y,
+	),
+	$form-control-tag-group-inline-item
+);
 
 $form-control-tag-group-btn: () !default;
-$form-control-tag-group-btn: map-deep-merge((
-	height: $form-control-inset-min-height,
-	line-height: 1,
-	margin-bottom: $form-control-inset-margin-y,
-	margin-top: $form-control-inset-margin-y,
-	padding-bottom: 0,
-	padding-left: $btn-padding-x-sm,
-	padding-right: $btn-padding-x-sm,
-	padding-top: 0,
-), $form-control-tag-group-btn);
+$form-control-tag-group-btn: map-deep-merge(
+	(
+		height: $form-control-inset-min-height,
+		line-height: 1,
+		margin-bottom: $form-control-inset-margin-y,
+		margin-top: $form-control-inset-margin-y,
+		padding-bottom: 0,
+		padding-left: $btn-padding-x-sm,
+		padding-right: $btn-padding-x-sm,
+		padding-top: 0,
+	),
+	$form-control-tag-group-btn
+);
 
 $form-control-tag-group-btn-monospaced: () !default;
-$form-control-tag-group-btn-monospaced: map-deep-merge((
-	height: $form-control-inset-min-height,
-	line-height: 1,
-	margin-bottom: $form-control-inset-margin-y,
-	margin-top: $form-control-inset-margin-y,
-	padding-left: 0,
-	padding-right: 0,
-	width: $form-control-inset-min-height,
-), $form-control-tag-group-btn-monospaced);
+$form-control-tag-group-btn-monospaced: map-deep-merge(
+	(
+		height: $form-control-inset-min-height,
+		line-height: 1,
+		margin-bottom: $form-control-inset-margin-y,
+		margin-top: $form-control-inset-margin-y,
+		padding-left: 0,
+		padding-right: 0,
+		width: $form-control-inset-min-height,
+	),
+	$form-control-tag-group-btn-monospaced
+);
 
 // Form Group
 
@@ -211,7 +250,8 @@ $input-danger-focus-bg: null !default;
 $input-danger-border-color: $form-feedback-invalid-color !default;
 $input-danger-focus-border-color: null !default;
 $input-danger-box-shadow: null !default;
-$input-danger-focus-box-shadow: 0 0 0 $input-focus-width rgba($form-feedback-invalid-color, 0.25) !default;
+$input-danger-focus-box-shadow: 0 0 0 $input-focus-width
+	rgba($form-feedback-invalid-color, 0.25) !default;
 $input-danger-color: null !default;
 $input-danger-focus-color: null !default;
 
@@ -220,22 +260,33 @@ $input-danger-readonly: () !default;
 $input-danger-checkbox-label-color: $form-feedback-invalid-color !default;
 $input-danger-label-color: null !default;
 $input-danger-select-icon-color: $input-danger-border-color !default;
-$input-danger-select-icon: clay-str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$input-danger-select-icon-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"), "#", "%23") !default;
+$input-danger-select-icon: clay-str-replace(
+	url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$input-danger-select-icon-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"),
+	'#',
+	'%23'
+) !default;
 
 $input-danger-select-size: () !default;
-$input-danger-select-size: map-deep-merge((
-	background-image: none,
-), $input-danger-select-size);
+$input-danger-select-size: map-deep-merge(
+	(
+		background-image: none,
+	),
+	$input-danger-select-size
+);
 
 $input-danger-select-multiple: () !default;
-$input-danger-select-multiple: map-deep-merge($input-danger-select-size, $input-danger-select-multiple);
+$input-danger-select-multiple: map-deep-merge(
+	$input-danger-select-size,
+	$input-danger-select-multiple
+);
 
 $input-success-bg: null !default;
 $input-success-focus-bg: null !default;
 $input-success-border-color: $form-feedback-valid-color !default;
 $input-success-focus-border-color: null !default;
 $input-success-box-shadow: null !default;
-$input-success-focus-box-shadow: 0 0 0 $input-focus-width rgba($form-feedback-valid-color, 0.25) !default;
+$input-success-focus-box-shadow: 0 0 0 $input-focus-width
+	rgba($form-feedback-valid-color, 0.25) !default;
 $input-success-color: null !default;
 $input-success-focus-color: null !default;
 
@@ -244,22 +295,33 @@ $input-success-readonly: () !default;
 $input-success-checkbox-label-color: $form-feedback-valid-color !default;
 $input-success-label-color: null !default;
 $input-success-select-icon-color: $input-success-border-color !default;
-$input-success-select-icon: clay-str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$input-success-select-icon-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"), "#", "%23") !default;
+$input-success-select-icon: clay-str-replace(
+	url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$input-success-select-icon-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"),
+	'#',
+	'%23'
+) !default;
 
 $input-success-select-size: () !default;
-$input-success-select-size: map-deep-merge((
-	background-image: none,
-), $input-success-select-size);
+$input-success-select-size: map-deep-merge(
+	(
+		background-image: none,
+	),
+	$input-success-select-size
+);
 
 $input-success-select-multiple: () !default;
-$input-success-select-multiple: map-deep-merge($input-success-select-size, $input-success-select-multiple);
+$input-success-select-multiple: map-deep-merge(
+	$input-success-select-size,
+	$input-success-select-multiple
+);
 
 $input-warning-bg: null !default;
 $input-warning-focus-bg: null !default;
 $input-warning-border-color: $form-feedback-warning-color !default;
 $input-warning-focus-border-color: null !default;
 $input-warning-box-shadow: null !default;
-$input-warning-focus-box-shadow: 0 0 0 $input-focus-width rgba($form-feedback-warning-color, 0.25) !default;
+$input-warning-focus-box-shadow: 0 0 0 $input-focus-width
+	rgba($form-feedback-warning-color, 0.25) !default;
 $input-warning-color: null !default;
 $input-warning-focus-color: null !default;
 
@@ -268,15 +330,25 @@ $input-warning-readonly: () !default;
 $input-warning-checkbox-label-color: $form-feedback-warning-color !default;
 $input-warning-label-color: null !default;
 $input-warning-select-icon-color: $input-warning-border-color !default;
-$input-warning-select-icon: clay-str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$input-warning-select-icon-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"), "#", "%23") !default;
+$input-warning-select-icon: clay-str-replace(
+	url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$input-warning-select-icon-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"),
+	'#',
+	'%23'
+) !default;
 
 $input-warning-select-size: () !default;
-$input-warning-select-size: map-deep-merge((
-	background-image: none,
-), $input-warning-select-size);
+$input-warning-select-size: map-deep-merge(
+	(
+		background-image: none,
+	),
+	$input-warning-select-size
+);
 
 $input-warning-select-multiple: () !default;
-$input-warning-select-multiple: map-deep-merge($input-warning-select-size, $input-warning-select-multiple);
+$input-warning-select-multiple: map-deep-merge(
+	$input-warning-select-size,
+	$input-warning-select-multiple
+);
 
 // Select Element
 
@@ -288,11 +360,16 @@ $input-select-bg-size: $custom-select-bg-size !default;
 $input-select-cursor: $link-cursor !default;
 $input-select-padding-bottom: null !default;
 $input-select-padding-left: null !default;
-$input-select-padding-right: $custom-select-indicator-padding + $input-btn-padding-x !default;
+$input-select-padding-right: $custom-select-indicator-padding +
+	$input-btn-padding-x !default;
 $input-select-padding-top: null !default;
 
 $input-select-icon-color: $input-color !default;
-$input-select-icon: clay-str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$input-select-icon-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"), "#", "%23") !default;
+$input-select-icon: clay-str-replace(
+	url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$input-select-icon-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"),
+	'#',
+	'%23'
+) !default;
 
 $input-select-icon-focus-color: null !default;
 $input-select-icon-focus: null !default;
@@ -301,45 +378,51 @@ $input-select-icon-disabled-color: null !default;
 $input-select-icon-disabled: null !default;
 
 $input-select: () !default;
-$input-select: map-deep-merge((
-	appearance: none,
-	background-color: $input-select-bg,
-	background-image: $input-select-icon,
-	background-position: $input-select-bg-position,
-	background-repeat: no-repeat,
-	background-size: $input-select-bg-size,
-	cursor: $input-select-cursor,
-	padding-bottom: $input-select-padding-bottom,
-	padding-left: $input-select-padding-left,
-	padding-right: $input-select-padding-right,
-	padding-top: $input-select-padding-top,
-	focus: (
-		background-color: $input-select-focus-bg,
-		background-image: $input-select-icon-focus,
-	),
-	disabled: (
-		background-image: $input-select-icon-disabled,
-	),
-	disabled-option: (
-		cursor: $disabled-cursor,
-	),
-	option: (
+$input-select: map-deep-merge(
+	(
+		appearance: none,
+		background-color: $input-select-bg,
+		background-image: $input-select-icon,
+		background-position: $input-select-bg-position,
+		background-repeat: no-repeat,
+		background-size: $input-select-bg-size,
 		cursor: $input-select-cursor,
+		padding-bottom: $input-select-padding-bottom,
+		padding-left: $input-select-padding-left,
+		padding-right: $input-select-padding-right,
+		padding-top: $input-select-padding-top,
+		focus: (
+			background-color: $input-select-focus-bg,
+			background-image: $input-select-icon-focus,
+		),
+		disabled: (
+			background-image: $input-select-icon-disabled,
+		),
+		disabled-option: (
+			cursor: $disabled-cursor,
+		),
+		option: (
+			cursor: $input-select-cursor,
+		),
 	),
-), $input-select);
+	$input-select
+);
 
 // Form Control Select for Divs Styled Like Select
 
 $form-control-select: () !default;
-$form-control-select: map-deep-merge((
-	map-deep-merge(
-		$input-select,
-		(
-			appearance: null,
-			cursor: null,
+$form-control-select: map-deep-merge(
+	(
+		map-deep-merge(
+			$input-select,
+			(
+				appearance: null,
+				cursor: null,
+			)
 		)
-	)
-), $form-control-select);
+	),
+	$form-control-select
+);
 
 // Select Size
 
@@ -347,23 +430,29 @@ $form-control-select: map-deep-merge((
 // if/when it gets added
 
 $input-select-size: () !default;
-$input-select-size: map-deep-merge((
-	background-image: none,
-	padding-left: 0.5rem,
-	padding-right: 0.5rem,
-	scrollbar-width: thin,
-	focus: (
+$input-select-size: map-deep-merge(
+	(
 		background-image: none,
+		padding-left: 0.5rem,
+		padding-right: 0.5rem,
+		scrollbar-width: thin,
+		focus: (
+			background-image: none,
+		),
+		option: (
+			padding: 0.25rem,
+		),
 	),
-	option: (
-		padding: 0.25rem,
-	),
-), $input-select-size);
+	$input-select-size
+);
 
 // Select Multiple
 
 $input-select-multiple: () !default;
-$input-select-multiple: map-deep-merge($input-select-size, $input-select-multiple);
+$input-select-multiple: map-deep-merge(
+	$input-select-size,
+	$input-select-multiple
+);
 
 // Form Feedback
 
@@ -407,28 +496,34 @@ $input-group-inset-item-padding-left: 5px !default;
 $input-group-inset-item-padding-right: 5px !default;
 
 $input-group-inset-item-btn: () !default;
-$input-group-inset-item-btn: map-deep-merge((
-	display: block,
-	height: 75%,
-	line-height: 1,
-	margin-left: 0.125rem,
-	margin-right: 0.125rem,
-	padding-bottom: 0,
-	padding-left: 0.5rem,
-	padding-right: 0.5rem,
-	padding-top: 0,
-	c-inner: (
-		align-items: center,
-		display: flex,
-		height: 100%,
-		justify-content: center,
+$input-group-inset-item-btn: map-deep-merge(
+	(
+		display: block,
+		height: 75%,
+		line-height: 1,
+		margin-left: 0.125rem,
+		margin-right: 0.125rem,
+		padding-bottom: 0,
+		padding-left: 0.5rem,
+		padding-right: 0.5rem,
+		padding-top: 0,
+		c-inner: (
+			align-items: center,
+			display: flex,
+			height: 100%,
+			justify-content: center,
+		),
 	),
-), $input-group-inset-item-btn);
+	$input-group-inset-item-btn
+);
 
 $input-group-inset-form-file-btn: () !default;
-$input-group-inset-form-file-btn: map-deep-merge((
-	height: 100%,
-), $input-group-inset-form-file-btn);
+$input-group-inset-form-file-btn: map-deep-merge(
+	(
+		height: 100%,
+	),
+	$input-group-inset-form-file-btn
+);
 
 // Input Group Lg
 
@@ -437,44 +532,53 @@ $input-group-addon-padding-x-lg: $input-padding-x-lg !default;
 $input-group-addon-padding-y-lg: null !default;
 
 $input-group-lg-item-btn: () !default; // .input-group-lg .input-group-item
-$input-group-lg-item-btn: map-deep-merge((
-	breakpoint-down: null,
-	font-size: $btn-font-size-lg,
-	inline-item-font-size: $btn-inline-item-font-size-lg,
-	section-font-size: $btn-section-font-size-lg,
-	font-size-mobile: $btn-font-size-lg-mobile,
-	padding-bottom-mobile: $btn-padding-y-lg-mobile,
-	padding-left-mobile: $btn-padding-x-lg-mobile,
-	padding-right-mobile: $btn-padding-x-lg-mobile,
-	padding-top-mobile: $btn-padding-y-lg-mobile,
-), $input-group-lg-item-btn);
+$input-group-lg-item-btn: map-deep-merge(
+	(
+		breakpoint-down: null,
+		font-size: $btn-font-size-lg,
+		inline-item-font-size: $btn-inline-item-font-size-lg,
+		section-font-size: $btn-section-font-size-lg,
+		font-size-mobile: $btn-font-size-lg-mobile,
+		padding-bottom-mobile: $btn-padding-y-lg-mobile,
+		padding-left-mobile: $btn-padding-x-lg-mobile,
+		padding-right-mobile: $btn-padding-x-lg-mobile,
+		padding-top-mobile: $btn-padding-y-lg-mobile,
+	),
+	$input-group-lg-item-btn
+);
 
 $input-group-lg-item-btn-monospaced: () !default;
-$input-group-lg-item-btn-monospaced: map-deep-merge((
-	breakpoint-down: null,
-	height: $btn-monospaced-size-lg,
-	line-height: 1,
-	padding-bottom: $btn-monospaced-padding-y-lg,
-	padding-left: $btn-monospaced-padding-x-lg,
-	padding-right: $btn-monospaced-padding-x-lg,
-	padding-top: $btn-monospaced-padding-y-lg,
-	width: $btn-monospaced-size-lg,
-	height-mobile: $btn-monospaced-size-lg-mobile,
-	width-mobile: $btn-monospaced-size-lg-mobile,
-), $input-group-lg-item-btn-monospaced);
+$input-group-lg-item-btn-monospaced: map-deep-merge(
+	(
+		breakpoint-down: null,
+		height: $btn-monospaced-size-lg,
+		line-height: 1,
+		padding-bottom: $btn-monospaced-padding-y-lg,
+		padding-left: $btn-monospaced-padding-x-lg,
+		padding-right: $btn-monospaced-padding-x-lg,
+		padding-top: $btn-monospaced-padding-y-lg,
+		width: $btn-monospaced-size-lg,
+		height-mobile: $btn-monospaced-size-lg-mobile,
+		width-mobile: $btn-monospaced-size-lg-mobile,
+	),
+	$input-group-lg-item-btn-monospaced
+);
 
 $input-group-lg-inset-item-btn: () !default;
 
 $input-group-lg-inset-item-form-file-btn: () !default;
-$input-group-lg-inset-item-form-file-btn: map-deep-merge((
-	breakpoint-down: null,
-	height: 100%,
-	line-height: 1,
-	padding-bottom: 0,
-	padding-left: 0.75rem,
-	padding-right: 0.75rem,
-	padding-top: 0,
-), $input-group-lg-inset-item-form-file-btn);
+$input-group-lg-inset-item-form-file-btn: map-deep-merge(
+	(
+		breakpoint-down: null,
+		height: 100%,
+		line-height: 1,
+		padding-bottom: 0,
+		padding-left: 0.75rem,
+		padding-right: 0.75rem,
+		padding-top: 0,
+	),
+	$input-group-lg-inset-item-form-file-btn
+);
 
 // Input Group Sm
 
@@ -483,55 +587,70 @@ $input-group-addon-padding-x-sm: $input-padding-x-sm !default;
 $input-group-addon-padding-y-sm: null !default;
 
 $input-group-sm-item-btn: () !default;
-$input-group-sm-item-btn: map-deep-merge((
-	font-size: $btn-font-size-sm,
-	inline-item-font-size: $btn-inline-item-font-size-sm,
-	section-font-size: $btn-section-font-size-sm,
-	font-size-mobile: $btn-font-size-sm-mobile,
-	padding-bottom-mobile: $btn-padding-y-sm-mobile,
-	padding-left-mobile: $btn-padding-x-sm-mobile,
-	padding-right-mobile: $btn-padding-x-sm-mobile,
-	padding-top-mobile: $btn-padding-y-sm-mobile,
-), $input-group-sm-item-btn);
+$input-group-sm-item-btn: map-deep-merge(
+	(
+		font-size: $btn-font-size-sm,
+		inline-item-font-size: $btn-inline-item-font-size-sm,
+		section-font-size: $btn-section-font-size-sm,
+		font-size-mobile: $btn-font-size-sm-mobile,
+		padding-bottom-mobile: $btn-padding-y-sm-mobile,
+		padding-left-mobile: $btn-padding-x-sm-mobile,
+		padding-right-mobile: $btn-padding-x-sm-mobile,
+		padding-top-mobile: $btn-padding-y-sm-mobile,
+	),
+	$input-group-sm-item-btn
+);
 
 $input-group-sm-item-btn-monospaced: () !default;
-$input-group-sm-item-btn-monospaced: map-deep-merge((
-	height: $btn-monospaced-size-sm,
-	line-height: 1,
-	padding-bottom: $btn-monospaced-padding-y-sm,
-	padding-left: $btn-monospaced-padding-x-sm,
-	padding-right: $btn-monospaced-padding-x-sm,
-	padding-top: $btn-monospaced-padding-y-sm,
-	width: $btn-monospaced-size-sm,
-	height-mobile: $btn-monospaced-size-sm-mobile,
-	width-mobile: $btn-monospaced-size-sm-mobile,
-), $input-group-sm-item-btn-monospaced);
+$input-group-sm-item-btn-monospaced: map-deep-merge(
+	(
+		height: $btn-monospaced-size-sm,
+		line-height: 1,
+		padding-bottom: $btn-monospaced-padding-y-sm,
+		padding-left: $btn-monospaced-padding-x-sm,
+		padding-right: $btn-monospaced-padding-x-sm,
+		padding-top: $btn-monospaced-padding-y-sm,
+		width: $btn-monospaced-size-sm,
+		height-mobile: $btn-monospaced-size-sm-mobile,
+		width-mobile: $btn-monospaced-size-sm-mobile,
+	),
+	$input-group-sm-item-btn-monospaced
+);
 
 $input-group-sm-inset-item-btn: () !default;
-$input-group-sm-inset-item-btn: map-deep-merge((
-	line-height: 1,
-	padding-bottom: 0,
-	padding-left: 0.5rem,
-	padding-right: 0.5rem,
-	padding-top: 0,
-), $input-group-sm-inset-item-btn);
+$input-group-sm-inset-item-btn: map-deep-merge(
+	(
+		line-height: 1,
+		padding-bottom: 0,
+		padding-left: 0.5rem,
+		padding-right: 0.5rem,
+		padding-top: 0,
+	),
+	$input-group-sm-inset-item-btn
+);
 
 $input-group-sm-inset-item-form-file-btn: () !default;
-$input-group-sm-inset-item-form-file-btn: map-deep-merge((
-	height: 100%,
-	line-height: 1,
-	padding-bottom: 0,
-	padding-left: 0.5rem,
-	padding-right: 0.5rem,
-	padding-top: 0,
-), $input-group-sm-inset-item-form-file-btn);
+$input-group-sm-inset-item-form-file-btn: map-deep-merge(
+	(
+		height: 100%,
+		line-height: 1,
+		padding-bottom: 0,
+		padding-left: 0.5rem,
+		padding-right: 0.5rem,
+		padding-top: 0,
+	),
+	$input-group-sm-inset-item-form-file-btn
+);
 
 // Input Group Stacked
 
 $input-group-stacked-sm-down: () !default;
-$input-group-stacked-sm-down: map-deep-merge((
-	breakpoint: sm,
-	item-margin-bottom: 0.5rem,
-	item-margin-left: 0,
-	shrink-margin-right: 0.5rem
-), $input-group-stacked-sm-down);
\ No newline at end of file
+$input-group-stacked-sm-down: map-deep-merge(
+	(
+		breakpoint: sm,
+		item-margin-bottom: 0.5rem,
+		item-margin-left: 0,
+		shrink-margin-right: 0.5rem,
+	),
+	$input-group-stacked-sm-down
+);
diff --git a/packages/clay-css/src/scss/variables/_globals-z-index.scss b/packages/clay-css/src/scss/variables/_globals-z-index.scss
index 3933e74d67..c873cbebe5 100644
--- a/packages/clay-css/src/scss/variables/_globals-z-index.scss
+++ b/packages/clay-css/src/scss/variables/_globals-z-index.scss
@@ -13,10 +13,12 @@ $zindex-input-group-focus: $zindex-input-group-hover + 1 !default; // 4
 $zindex-navbar-collapse-absolute: 500 !default;
 $zindex-navbar-overlay: 450 !default;
 $zindex-navbar-toggler-focus: 525 !default;
-$zindex-menubar-vertical-expand-md-collapse-mobile: $zindex-navbar-collapse-absolute - 1 !default; // 499
-$zindex-menubar-vertical-expand-lg-collapse-mobile: $zindex-navbar-collapse-absolute - 1 !default; // 499
+$zindex-menubar-vertical-expand-md-collapse-mobile: $zindex-navbar-collapse-absolute -
+	1 !default; // 499
+$zindex-menubar-vertical-expand-lg-collapse-mobile: $zindex-navbar-collapse-absolute -
+	1 !default; // 499
 $zindex-pagination-link-focus: 4 !default;
 $zindex-pagination-link-active: 3 !default;
 $zindex-pagination-link-disabled: 0 !default;
 $zindex-panel-header-link-focus: 1 !default;
-$zindex-sidenav: $zindex-fixed + 5 !default; // 1035
\ No newline at end of file
+$zindex-sidenav: $zindex-fixed + 5 !default; // 1035
diff --git a/packages/clay-css/src/scss/variables/_globals.scss b/packages/clay-css/src/scss/variables/_globals.scss
index c9f36c22ea..2e86c1f4f1 100644
--- a/packages/clay-css/src/scss/variables/_globals.scss
+++ b/packages/clay-css/src/scss/variables/_globals.scss
@@ -11,13 +11,13 @@ $primary-d1: darken($primary, 7.5) !default;
 $primary-d2: darken($primary, 10) !default;
 $primary-l1: lighten($primary, 22.94) !default;
 $primary-l2: lighten($primary, 32.94) !default;
-$primary-l3: lighten($primary, 44.90) !default;
+$primary-l3: lighten($primary, 44.9) !default;
 
 $secondary-d1: darken($secondary, 7.5) !default;
 $secondary-d2: darken($secondary, 10) !default;
 $secondary-l1: lighten($secondary, 22.94) !default;
 $secondary-l2: lighten($secondary, 32.94) !default;
-$secondary-l3: lighten($secondary, 44.90) !default;
+$secondary-l3: lighten($secondary, 44.9) !default;
 
 $info-d1: darken($info, 7.5) !default;
 $info-d2: darken($info, 10) !default;
@@ -65,19 +65,25 @@ $disabled-cursor: not-allowed !default;
 // Containers
 
 $container-form-lg: () !default;
-$container-form-lg: map-deep-merge((
-	breakpoint-up: lg,
-	padding-bottom: 3rem,
-	padding-top: 3rem,
-	padding-bottom-mobile: 1rem,
-	padding-top-mobile: 1rem
-), $container-form-lg);
+$container-form-lg: map-deep-merge(
+	(
+		breakpoint-up: lg,
+		padding-bottom: 3rem,
+		padding-top: 3rem,
+		padding-bottom-mobile: 1rem,
+		padding-top-mobile: 1rem,
+	),
+	$container-form-lg
+);
 
 $container-view: () !default;
-$container-view: map-deep-merge((
-	padding-bottom: 1.5rem,
-	padding-top: 1.5rem
-), $container-view);
+$container-view: map-deep-merge(
+	(
+		padding-bottom: 1.5rem,
+		padding-top: 1.5rem,
+	),
+	$container-view
+);
 
 // Fonts
 
@@ -86,7 +92,7 @@ $webkit-font-smoothing: null !default;
 
 $font-import-url: null !default;
 
-$font-family-serif: Georgia, "Times New Roman", Times, serif !default;
+$font-family-serif: Georgia, 'Times New Roman', Times, serif !default;
 
 $font-size-base-mobile: $font-size-base !default;
 $font-size-lg-mobile: $font-size-lg !default;
@@ -103,4 +109,4 @@ $h6-font-size-mobile: null !default;
 
 $body-moz-osx-font-smoothing: $moz-osx-font-smoothing !default;
 $body-webkit-font-smoothing: $webkit-font-smoothing !default;
-$body-text-align: inherit !default;
\ No newline at end of file
+$body-text-align: inherit !default;
diff --git a/packages/clay-css/src/scss/variables/_icons.scss b/packages/clay-css/src/scss/variables/_icons.scss
index a17f0cc052..a05ed4ebb2 100644
--- a/packages/clay-css/src/scss/variables/_icons.scss
+++ b/packages/clay-css/src/scss/variables/_icons.scss
@@ -4,7 +4,11 @@ $collapse-icon-padding-right: 2.28125rem !default; // 45px
 $collapse-icon-position-bottom: null !default;
 $collapse-icon-position-left: null !default;
 $collapse-icon-position-right: 0.9375rem !default; // 15px
-$collapse-icon-position-top: clay-collapse-icon-align($nav-link-padding-y, 0.0625rem, 0.9375em) !default;
+$collapse-icon-position-top: clay-collapse-icon-align(
+	$nav-link-padding-y,
+	0.0625rem,
+	0.9375em
+) !default;
 
 $lexicon-icon-size: 1em !default; // 16px
 
@@ -13,4 +17,4 @@ $lexicon-icon-lg-font-size: 2rem !default; // 32px
 $lexicon-icon-xl-font-size: 8rem !default; // 128px
 
 $order-arrow-down-active-color: rgba($black, 0.9) !default;
-$order-arrow-up-active-color: $order-arrow-down-active-color !default;
\ No newline at end of file
+$order-arrow-up-active-color: $order-arrow-down-active-color !default;
diff --git a/packages/clay-css/src/scss/variables/_labels.scss b/packages/clay-css/src/scss/variables/_labels.scss
index 36605ea4bb..a4d241daef 100644
--- a/packages/clay-css/src/scss/variables/_labels.scss
+++ b/packages/clay-css/src/scss/variables/_labels.scss
@@ -43,32 +43,38 @@ $label-border-width: 0.0625rem !default;
 // Label Close
 
 $label-close: () !default;
-$label-close: map-deep-merge((
-	color: inherit,
-	opacity: 1,
-	hover-color: inherit,
-	hover-opacity: 1,
-	focus-opacity: 1,
-	disabled-opacity: $btn-disabled-opacity,
-	border-radius: 1px,
-	display: inline-flex,
-	font-size: inherit,
-	height: auto,
-	width: auto
-), $label-close);
+$label-close: map-deep-merge(
+	(
+		color: inherit,
+		opacity: 1,
+		hover-color: inherit,
+		hover-opacity: 1,
+		focus-opacity: 1,
+		disabled-opacity: $btn-disabled-opacity,
+		border-radius: 1px,
+		display: inline-flex,
+		font-size: inherit,
+		height: auto,
+		width: auto,
+	),
+	$label-close
+);
 
 // Label Sizes
 
 $label-lg: () !default;
-$label-lg: map-deep-merge((
-	// 14px
-	font-size: 0.875rem,
-	// 16px
-	padding-x: 1rem,
-	// 6px
-	padding-y: 0.375rem,
-	text-transform: none
-), $label-lg);
+$label-lg: map-deep-merge(
+	(
+		// 14px
+			font-size: 0.875rem,
+		// 16px
+			padding-x: 1rem,
+		// 6px
+			padding-y: 0.375rem,
+		text-transform: none
+	),
+	$label-lg
+);
 
 // Label Variants
 
@@ -107,24 +113,30 @@ $label-primary-link-color: null !default;
 $label-primary-link-hover-color: $label-primary-hover-color !default;
 
 $label-primary-close: () !default;
-$label-primary-close: map-deep-merge((
-	hover-color: $label-primary-hover-color,
-	focus-color: $label-primary-hover-color,
-), $label-primary-close);
+$label-primary-close: map-deep-merge(
+	(
+		hover-color: $label-primary-hover-color,
+		focus-color: $label-primary-hover-color,
+	),
+	$label-primary-close
+);
 
 $label-primary: () !default;
-$label-primary: map-deep-merge((
-	bg: $label-primary-bg,
-	border-color: $label-primary-border-color,
-	color: $label-primary-color,
-	hover-bg: $label-primary-hover-bg,
-	hover-border-color: $label-primary-hover-border-color,
-	hover-color: $label-primary-hover-color,
-	focus-color: $label-primary-hover-color,
-	link-color: $label-primary-link-color,
-	link-hover-color: $label-primary-link-hover-color,
-	close: $label-primary-close,
-), $label-primary);
+$label-primary: map-deep-merge(
+	(
+		bg: $label-primary-bg,
+		border-color: $label-primary-border-color,
+		color: $label-primary-color,
+		hover-bg: $label-primary-hover-bg,
+		hover-border-color: $label-primary-hover-border-color,
+		hover-color: $label-primary-hover-color,
+		focus-color: $label-primary-hover-color,
+		link-color: $label-primary-link-color,
+		link-hover-color: $label-primary-link-hover-color,
+		close: $label-primary-close,
+	),
+	$label-primary
+);
 
 /// @deprecated as of v2.4.1 use the Sass map `$label-secondary` instead
 
@@ -159,24 +171,30 @@ $label-secondary-link-color: null !default;
 $label-secondary-link-hover-color: $label-secondary-hover-color !default;
 
 $label-secondary-close: () !default;
-$label-secondary-close: map-deep-merge((
-	hover-color: $label-secondary-hover-color,
-	focus-color: $label-secondary-hover-color,
-), $label-secondary-close);
+$label-secondary-close: map-deep-merge(
+	(
+		hover-color: $label-secondary-hover-color,
+		focus-color: $label-secondary-hover-color,
+	),
+	$label-secondary-close
+);
 
 $label-secondary: () !default;
-$label-secondary: map-deep-merge((
-	bg: $label-secondary-bg,
-	border-color: $label-secondary-border-color,
-	color: $label-secondary-color,
-	hover-bg: $label-secondary-hover-bg,
-	hover-border-color: $label-secondary-hover-border-color,
-	hover-color: $label-secondary-hover-color,
-	focus-color: $label-secondary-hover-color,
-	link-color: $label-secondary-link-color,
-	link-hover-color: $label-secondary-link-hover-color,
-	close: $label-secondary-close,
-), $label-secondary);
+$label-secondary: map-deep-merge(
+	(
+		bg: $label-secondary-bg,
+		border-color: $label-secondary-border-color,
+		color: $label-secondary-color,
+		hover-bg: $label-secondary-hover-bg,
+		hover-border-color: $label-secondary-hover-border-color,
+		hover-color: $label-secondary-hover-color,
+		focus-color: $label-secondary-hover-color,
+		link-color: $label-secondary-link-color,
+		link-hover-color: $label-secondary-link-hover-color,
+		close: $label-secondary-close,
+	),
+	$label-secondary
+);
 
 /// @deprecated as of v2.4.1 use the Sass map `$label-success` instead
 
@@ -211,24 +229,30 @@ $label-success-link-color: null !default;
 $label-success-link-hover-color: $label-success-hover-color !default;
 
 $label-success-close: () !default;
-$label-success-close: map-deep-merge((
-	hover-color: $label-success-hover-color,
-	focus-color: $label-success-hover-color,
-), $label-success-close);
+$label-success-close: map-deep-merge(
+	(
+		hover-color: $label-success-hover-color,
+		focus-color: $label-success-hover-color,
+	),
+	$label-success-close
+);
 
 $label-success: () !default;
-$label-success: map-deep-merge((
-	bg: $label-success-bg,
-	border-color: $label-success-border-color,
-	color: $label-success-color,
-	hover-bg: $label-success-hover-bg,
-	hover-border-color: $label-success-hover-border-color,
-	hover-color: $label-success-hover-color,
-	focus-color: $label-success-hover-color,
-	link-color: $label-success-link-color,
-	link-hover-color: $label-success-link-hover-color,
-	close: $label-success-close,
-), $label-success);
+$label-success: map-deep-merge(
+	(
+		bg: $label-success-bg,
+		border-color: $label-success-border-color,
+		color: $label-success-color,
+		hover-bg: $label-success-hover-bg,
+		hover-border-color: $label-success-hover-border-color,
+		hover-color: $label-success-hover-color,
+		focus-color: $label-success-hover-color,
+		link-color: $label-success-link-color,
+		link-hover-color: $label-success-link-hover-color,
+		close: $label-success-close,
+	),
+	$label-success
+);
 
 /// @deprecated as of v2.4.1 use the Sass map `$label-info` instead
 
@@ -263,24 +287,30 @@ $label-info-link-color: null !default;
 $label-info-link-hover-color: $label-info-hover-color !default;
 
 $label-info-close: () !default;
-$label-info-close: map-deep-merge((
-	hover-color: $label-info-hover-color,
-	focus-color: $label-info-hover-color,
-), $label-info-close);
+$label-info-close: map-deep-merge(
+	(
+		hover-color: $label-info-hover-color,
+		focus-color: $label-info-hover-color,
+	),
+	$label-info-close
+);
 
 $label-info: () !default;
-$label-info: map-deep-merge((
-	bg: $label-info-bg,
-	border-color: $label-info-border-color,
-	color: $label-info-color,
-	hover-bg: $label-info-hover-bg,
-	hover-border-color: $label-info-hover-border-color,
-	hover-color: $label-info-hover-color,
-	focus-color: $label-info-hover-color,
-	link-color: $label-info-link-color,
-	link-hover-color: $label-info-link-hover-color,
-	close: $label-info-close,
-), $label-info);
+$label-info: map-deep-merge(
+	(
+		bg: $label-info-bg,
+		border-color: $label-info-border-color,
+		color: $label-info-color,
+		hover-bg: $label-info-hover-bg,
+		hover-border-color: $label-info-hover-border-color,
+		hover-color: $label-info-hover-color,
+		focus-color: $label-info-hover-color,
+		link-color: $label-info-link-color,
+		link-hover-color: $label-info-link-hover-color,
+		close: $label-info-close,
+	),
+	$label-info
+);
 
 /// @deprecated as of v2.4.1 use the Sass map `$label-warning` instead
 
@@ -315,24 +345,30 @@ $label-warning-link-color: null !default;
 $label-warning-link-hover-color: $label-warning-hover-color !default;
 
 $label-warning-close: () !default;
-$label-warning-close: map-deep-merge((
-	hover-color: $label-warning-hover-color,
-	focus-color: $label-warning-hover-color,
-), $label-warning-close);
+$label-warning-close: map-deep-merge(
+	(
+		hover-color: $label-warning-hover-color,
+		focus-color: $label-warning-hover-color,
+	),
+	$label-warning-close
+);
 
 $label-warning: () !default;
-$label-warning: map-deep-merge((
-	bg: $label-warning-bg,
-	border-color: $label-warning-border-color,
-	color: $label-warning-color,
-	hover-bg: $label-warning-hover-bg,
-	hover-border-color: $label-warning-hover-border-color,
-	hover-color: $label-warning-hover-color,
-	focus-color: $label-warning-hover-color,
-	link-color: $label-warning-link-color,
-	link-hover-color: $label-warning-link-hover-color,
-	close: $label-warning-close,
-), $label-warning);
+$label-warning: map-deep-merge(
+	(
+		bg: $label-warning-bg,
+		border-color: $label-warning-border-color,
+		color: $label-warning-color,
+		hover-bg: $label-warning-hover-bg,
+		hover-border-color: $label-warning-hover-border-color,
+		hover-color: $label-warning-hover-color,
+		focus-color: $label-warning-hover-color,
+		link-color: $label-warning-link-color,
+		link-hover-color: $label-warning-link-hover-color,
+		close: $label-warning-close,
+	),
+	$label-warning
+);
 
 /// @deprecated as of v2.4.1 use the Sass map `$label-danger` instead
 
@@ -367,24 +403,30 @@ $label-danger-link-color: null !default;
 $label-danger-link-hover-color: $label-danger-hover-color !default;
 
 $label-danger-close: () !default;
-$label-danger-close: map-deep-merge((
-	hover-color: $label-danger-hover-color,
-	focus-color: $label-danger-hover-color,
-), $label-danger-close);
+$label-danger-close: map-deep-merge(
+	(
+		hover-color: $label-danger-hover-color,
+		focus-color: $label-danger-hover-color,
+	),
+	$label-danger-close
+);
 
 $label-danger: () !default;
-$label-danger: map-deep-merge((
-	bg: $label-danger-bg,
-	border-color: $label-danger-border-color,
-	color: $label-danger-color,
-	hover-bg: $label-danger-hover-bg,
-	hover-border-color: $label-danger-hover-border-color,
-	hover-color: $label-danger-hover-color,
-	focus-color: $label-danger-hover-color,
-	link-color: $label-danger-link-color,
-	link-hover-color: $label-danger-link-hover-color,
-	close: $label-danger-close,
-), $label-danger);
+$label-danger: map-deep-merge(
+	(
+		bg: $label-danger-bg,
+		border-color: $label-danger-border-color,
+		color: $label-danger-color,
+		hover-bg: $label-danger-hover-bg,
+		hover-border-color: $label-danger-hover-border-color,
+		hover-color: $label-danger-hover-color,
+		focus-color: $label-danger-hover-color,
+		link-color: $label-danger-link-color,
+		link-hover-color: $label-danger-link-hover-color,
+		close: $label-danger-close,
+	),
+	$label-danger
+);
 
 /// @deprecated as of v2.4.1 use the Sass map `$label-light` instead
 
@@ -419,24 +461,30 @@ $label-light-link-color: null !default;
 $label-light-link-hover-color: $label-light-hover-color !default;
 
 $label-light-close: () !default;
-$label-light-close: map-deep-merge((
-	hover-color: $label-light-hover-color,
-	focus-color: $label-light-hover-color,
-), $label-light-close);
+$label-light-close: map-deep-merge(
+	(
+		hover-color: $label-light-hover-color,
+		focus-color: $label-light-hover-color,
+	),
+	$label-light-close
+);
 
 $label-light: () !default;
-$label-light: map-deep-merge((
-	bg: $label-light-bg,
-	border-color: $label-light-border-color,
-	color: $label-light-color,
-	hover-bg: $label-light-hover-bg,
-	hover-border-color: $label-light-hover-border-color,
-	hover-color: $label-light-hover-color,
-	focus-color: $label-light-hover-color,
-	link-color: $label-light-link-color,
-	link-hover-color: $label-light-link-hover-color,
-	close: $label-light-close,
-), $label-light);
+$label-light: map-deep-merge(
+	(
+		bg: $label-light-bg,
+		border-color: $label-light-border-color,
+		color: $label-light-color,
+		hover-bg: $label-light-hover-bg,
+		hover-border-color: $label-light-hover-border-color,
+		hover-color: $label-light-hover-color,
+		focus-color: $label-light-hover-color,
+		link-color: $label-light-link-color,
+		link-hover-color: $label-light-link-hover-color,
+		close: $label-light-close,
+	),
+	$label-light
+);
 
 /// @deprecated as of v2.4.1 use the Sass map `$label-dark` instead
 
@@ -471,187 +519,220 @@ $label-dark-link-color: null !default;
 $label-dark-link-hover-color: $label-dark-hover-color !default;
 
 $label-dark-close: () !default;
-$label-dark-close: map-deep-merge((
-	hover-color: $label-dark-hover-color,
-	focus-color: $label-dark-hover-color,
-), $label-dark-close);
+$label-dark-close: map-deep-merge(
+	(
+		hover-color: $label-dark-hover-color,
+		focus-color: $label-dark-hover-color,
+	),
+	$label-dark-close
+);
 
 $label-dark: () !default;
-$label-dark: map-deep-merge((
-	bg: $label-dark-bg,
-	border-color: $label-dark-border-color,
-	color: $label-dark-color,
-	hover-bg: $label-dark-hover-bg,
-	hover-border-color: $label-dark-hover-border-color,
-	hover-color: $label-dark-hover-color,
-	focus-color: $label-dark-hover-color,
-	link-color: $label-dark-link-color,
-	link-hover-color: $label-dark-link-hover-color,
-	close: $label-dark-close,
-), $label-dark);
+$label-dark: map-deep-merge(
+	(
+		bg: $label-dark-bg,
+		border-color: $label-dark-border-color,
+		color: $label-dark-color,
+		hover-bg: $label-dark-hover-bg,
+		hover-border-color: $label-dark-hover-border-color,
+		hover-color: $label-dark-hover-color,
+		focus-color: $label-dark-hover-color,
+		link-color: $label-dark-link-color,
+		link-hover-color: $label-dark-link-hover-color,
+		close: $label-dark-close,
+	),
+	$label-dark
+);
 
 // Label Inverse
 
 $label-inverse-primary: () !default;
-$label-inverse-primary: map-deep-merge((
-	background-color: $primary,
-	border-color: $primary,
-	color: color-yiq($primary),
-	hover: (
-		background-color: darken($primary, 10%),
-		border-color: darken($primary, 10%),
-		color: color-yiq(darken($primary, 10%)),
+$label-inverse-primary: map-deep-merge(
+	(
+		background-color: $primary,
+		border-color: $primary,
+		color: color-yiq($primary),
+		hover: (
+			background-color: darken($primary, 10%),
+			border-color: darken($primary, 10%),
+			color: color-yiq(darken($primary, 10%)),
+		),
+		link-hover: (
+			color: darken(color-yiq(darken($primary, 10%)), 10%),
+		),
+		close: (
+			hover-color: darken(color-yiq(darken($primary, 10%)), 10%),
+		),
 	),
-	link-hover: (
-		color: darken(color-yiq(darken($primary, 10%)), 10%),
-	),
-	close: (
-		hover-color: darken(color-yiq(darken($primary, 10%)), 10%),
-	),
-), $label-inverse-primary);
+	$label-inverse-primary
+);
 
 $label-inverse-secondary: () !default;
-$label-inverse-secondary: map-deep-merge((
-	background-color: $secondary,
-	border-color: $secondary,
-	color: color-yiq($secondary),
-	hover: (
-		background-color: darken($secondary, 10%),
-		border-color: darken($secondary, 10%),
-		color: color-yiq(darken($secondary, 10%)),
-	),
-	link-hover: (
-		color: darken(color-yiq(darken($secondary, 10%)), 10%),
+$label-inverse-secondary: map-deep-merge(
+	(
+		background-color: $secondary,
+		border-color: $secondary,
+		color: color-yiq($secondary),
+		hover: (
+			background-color: darken($secondary, 10%),
+			border-color: darken($secondary, 10%),
+			color: color-yiq(darken($secondary, 10%)),
+		),
+		link-hover: (
+			color: darken(color-yiq(darken($secondary, 10%)), 10%),
+		),
+		close: (
+			hover-color: darken(color-yiq(darken($secondary, 10%)), 10%),
+		),
 	),
-	close: (
-		hover-color: darken(color-yiq(darken($secondary, 10%)), 10%),
-	),
-), $label-inverse-secondary);
+	$label-inverse-secondary
+);
 
 $label-inverse-success: () !default;
-$label-inverse-success: map-deep-merge((
-	background-color: $success,
-	border-color: $success,
-	color: color-yiq($success),
-	hover: (
-		background-color: darken($success, 10%),
-		border-color: darken($success, 10%),
-		color: color-yiq(darken($success, 10%)),
-	),
-	link-hover: (
-		color: darken(color-yiq(darken($success, 10%)), 10%),
+$label-inverse-success: map-deep-merge(
+	(
+		background-color: $success,
+		border-color: $success,
+		color: color-yiq($success),
+		hover: (
+			background-color: darken($success, 10%),
+			border-color: darken($success, 10%),
+			color: color-yiq(darken($success, 10%)),
+		),
+		link-hover: (
+			color: darken(color-yiq(darken($success, 10%)), 10%),
+		),
+		close: (
+			hover-color: darken(color-yiq(darken($success, 10%)), 10%),
+		),
 	),
-	close: (
-		hover-color: darken(color-yiq(darken($success, 10%)), 10%),
-	),
-), $label-inverse-success);
+	$label-inverse-success
+);
 
 $label-inverse-info: () !default;
-$label-inverse-info: map-deep-merge((
-	background-color: $info,
-	border-color: $info,
-	color: color-yiq($info),
-	hover: (
-		background-color: darken($info, 10%),
-		border-color: darken($info, 10%),
-		color: color-yiq(darken($info, 10%)),
-	),
-	link-hover: (
-		color: darken(color-yiq(darken($info, 10%)), 10%),
+$label-inverse-info: map-deep-merge(
+	(
+		background-color: $info,
+		border-color: $info,
+		color: color-yiq($info),
+		hover: (
+			background-color: darken($info, 10%),
+			border-color: darken($info, 10%),
+			color: color-yiq(darken($info, 10%)),
+		),
+		link-hover: (
+			color: darken(color-yiq(darken($info, 10%)), 10%),
+		),
+		close: (
+			hover-color: darken(color-yiq(darken($info, 10%)), 10%),
+		),
 	),
-	close: (
-		hover-color: darken(color-yiq(darken($info, 10%)), 10%),
-	),
-), $label-inverse-info);
+	$label-inverse-info
+);
 
 $label-inverse-warning: () !default;
-$label-inverse-warning: map-deep-merge((
-	background-color: $warning,
-	border-color: $warning,
-	color: color-yiq($warning),
-	hover: (
-		background-color: darken($warning, 10%),
-		border-color: darken($warning, 10%),
-		color: color-yiq(darken($warning, 10%)),
-	),
-	link-hover: (
-		color: lighten(color-yiq(darken($warning, 10%)), 20%),
+$label-inverse-warning: map-deep-merge(
+	(
+		background-color: $warning,
+		border-color: $warning,
+		color: color-yiq($warning),
+		hover: (
+			background-color: darken($warning, 10%),
+			border-color: darken($warning, 10%),
+			color: color-yiq(darken($warning, 10%)),
+		),
+		link-hover: (
+			color: lighten(color-yiq(darken($warning, 10%)), 20%),
+		),
+		close: (
+			hover-color: lighten(color-yiq(darken($warning, 10%)), 20%),
+		),
 	),
-	close: (
-		hover-color: lighten(color-yiq(darken($warning, 10%)), 20%),
-	),
-), $label-inverse-warning);
+	$label-inverse-warning
+);
 
 $label-inverse-danger: () !default;
-$label-inverse-danger: map-deep-merge((
-	background-color: $danger,
-	border-color: $danger,
-	color: color-yiq($danger),
-	hover: (
-		background-color: darken($danger, 10%),
-		border-color: darken($danger, 10%),
-		color: color-yiq(darken($danger, 10%)),
-	),
-	link-hover: (
-		color: darken(color-yiq(darken($danger, 10%)), 10%),
+$label-inverse-danger: map-deep-merge(
+	(
+		background-color: $danger,
+		border-color: $danger,
+		color: color-yiq($danger),
+		hover: (
+			background-color: darken($danger, 10%),
+			border-color: darken($danger, 10%),
+			color: color-yiq(darken($danger, 10%)),
+		),
+		link-hover: (
+			color: darken(color-yiq(darken($danger, 10%)), 10%),
+		),
+		close: (
+			hover-color: darken(color-yiq(darken($danger, 10%)), 10%),
+		),
 	),
-	close: (
-		hover-color: darken(color-yiq(darken($danger, 10%)), 10%),
-	),
-), $label-inverse-danger);
+	$label-inverse-danger
+);
 
 $label-inverse-light: () !default;
-$label-inverse-light: map-deep-merge((
-	background-color: $light,
-	border-color: $light,
-	color: color-yiq($light),
-	hover: (
-		background-color: darken($light, 10%),
-		border-color: darken($light, 10%),
-		color: color-yiq(darken($light, 10%)),
-	),
-	link-hover: (
-		color: lighten(color-yiq(darken($light, 10%)), 10%),
+$label-inverse-light: map-deep-merge(
+	(
+		background-color: $light,
+		border-color: $light,
+		color: color-yiq($light),
+		hover: (
+			background-color: darken($light, 10%),
+			border-color: darken($light, 10%),
+			color: color-yiq(darken($light, 10%)),
+		),
+		link-hover: (
+			color: lighten(color-yiq(darken($light, 10%)), 10%),
+		),
+		close: (
+			hover-color: lighten(color-yiq(darken($light, 10%)), 10%),
+		),
 	),
-	close: (
-		hover-color: lighten(color-yiq(darken($light, 10%)), 10%),
-	),
-), $label-inverse-light);
+	$label-inverse-light
+);
 
 $label-inverse-dark: () !default;
-$label-inverse-dark: map-deep-merge((
-	background-color: $dark,
-	border-color: $dark,
-	color: color-yiq($dark),
-	hover: (
-		background-color: darken($dark, 10%),
-		border-color: darken($dark, 10%),
-		color: color-yiq(darken($dark, 10%)),
-	),
-	link-hover: (
-		color: darken(color-yiq(darken($dark, 10%)), 10%),
+$label-inverse-dark: map-deep-merge(
+	(
+		background-color: $dark,
+		border-color: $dark,
+		color: color-yiq($dark),
+		hover: (
+			background-color: darken($dark, 10%),
+			border-color: darken($dark, 10%),
+			color: color-yiq(darken($dark, 10%)),
+		),
+		link-hover: (
+			color: darken(color-yiq(darken($dark, 10%)), 10%),
+		),
+		close: (
+			hover-color: darken(color-yiq(darken($dark, 10%)), 10%),
+		),
 	),
-	close: (
-		hover-color: darken(color-yiq(darken($dark, 10%)), 10%),
-	),
-), $label-inverse-dark);
+	$label-inverse-dark
+);
 
 $label-palette: () !default;
-$label-palette: map-deep-merge((
-	primary: $label-primary,
-	secondary: $label-secondary,
-	success: $label-success,
-	info: $label-info,
-	warning: $label-warning,
-	danger: $label-danger,
-	dark: $label-dark,
-	light: $label-light,
-	inverse-primary: $label-inverse-primary,
-	inverse-secondary: $label-inverse-secondary,
-	inverse-success: $label-inverse-success,
-	inverse-info: $label-inverse-info,
-	inverse-warning: $label-inverse-warning,
-	inverse-danger: $label-inverse-danger,
-	inverse-light: $label-inverse-light,
-	inverse-dark: $label-inverse-dark,
-), $label-palette);
\ No newline at end of file
+$label-palette: map-deep-merge(
+	(
+		primary: $label-primary,
+		secondary: $label-secondary,
+		success: $label-success,
+		info: $label-info,
+		warning: $label-warning,
+		danger: $label-danger,
+		dark: $label-dark,
+		light: $label-light,
+		inverse-primary: $label-inverse-primary,
+		inverse-secondary: $label-inverse-secondary,
+		inverse-success: $label-inverse-success,
+		inverse-info: $label-inverse-info,
+		inverse-warning: $label-inverse-warning,
+		inverse-danger: $label-inverse-danger,
+		inverse-light: $label-inverse-light,
+		inverse-dark: $label-inverse-dark,
+	),
+	$label-palette
+);
diff --git a/packages/clay-css/src/scss/variables/_links.scss b/packages/clay-css/src/scss/variables/_links.scss
index 5c2151a15c..0788fe212e 100644
--- a/packages/clay-css/src/scss/variables/_links.scss
+++ b/packages/clay-css/src/scss/variables/_links.scss
@@ -5,22 +5,31 @@
 $single-link-font-weight: $font-weight-semi-bold !default;
 
 $component-link: () !default;
-$component-link: map-deep-merge((
-	color: $gray-600,
-	hover-color: darken($gray-600, 15%)
-), $component-link);
+$component-link: map-deep-merge(
+	(
+		color: $gray-600,
+		hover-color: darken($gray-600, 15%),
+	),
+	$component-link
+);
 
 $link-primary: () !default;
-$link-primary: map-deep-merge((
-	color: $primary,
-	hover-color: darken($primary, 15%)
-), $link-primary);
+$link-primary: map-deep-merge(
+	(
+		color: $primary,
+		hover-color: darken($primary, 15%),
+	),
+	$link-primary
+);
 
 $link-secondary: () !default;
-$link-secondary: map-deep-merge((
-	color: $secondary,
-	hover-color: darken($secondary, 15%)
-), $link-secondary);
+$link-secondary: map-deep-merge(
+	(
+		color: $secondary,
+		hover-color: darken($secondary, 15%),
+	),
+	$link-secondary
+);
 
 // Link Outline
 
@@ -57,59 +66,68 @@ $link-outline-padding-y: $btn-padding-y-sm !default;
 $link-outline-transition: $btn-transition !default;
 
 $link-outline: () !default;
-$link-outline: map-deep-merge((
-	align-items: center,
-	bg: transparent,
-	border-color: transparent,
-	border-radius: $link-outline-border-radius,
-	border-style: solid,
-	border-width: $link-outline-border-width,
-	display: inline-flex,
-	font-size: $link-outline-font-size,
-	font-weight: $link-outline-font-weight,
-	justify-content: center,
-	line-height: $link-outline-line-height,
-	padding-bottom: $link-outline-padding-y,
-	padding-left: $link-outline-padding-x,
-	padding-right: $link-outline-padding-x,
-	padding-top: $link-outline-padding-y,
-	transition: $link-outline-transition,
-	vertical-align: middle,
-	hover-text-decoration: none,
-	lexicon-icon-margin-top: 0,
-), $link-outline);
+$link-outline: map-deep-merge(
+	(
+		align-items: center,
+		bg: transparent,
+		border-color: transparent,
+		border-radius: $link-outline-border-radius,
+		border-style: solid,
+		border-width: $link-outline-border-width,
+		display: inline-flex,
+		font-size: $link-outline-font-size,
+		font-weight: $link-outline-font-weight,
+		justify-content: center,
+		line-height: $link-outline-line-height,
+		padding-bottom: $link-outline-padding-y,
+		padding-left: $link-outline-padding-x,
+		padding-right: $link-outline-padding-x,
+		padding-top: $link-outline-padding-y,
+		transition: $link-outline-transition,
+		vertical-align: middle,
+		hover-text-decoration: none,
+		lexicon-icon-margin-top: 0,
+	),
+	$link-outline
+);
 
 $link-outline-primary: () !default;
-$link-outline-primary: map-deep-merge((
-	border-color: $primary,
-	color: $primary,
-	hover-bg: $primary,
-	hover-color: $white,
-	btn-focus-box-shadow: 0 0 0 $btn-focus-width rgba($primary, 0.5),
-	btn-focus-outline: 0,
-	disabled-bg: transparent,
-	disabled-color: $primary,
-	disabled-cursor: $btn-disabled-cursor,
-	disabled-opacity: $btn-disabled-opacity,
-	active-bg: $primary,
-	active-color: $white,
-), $link-outline-primary);
+$link-outline-primary: map-deep-merge(
+	(
+		border-color: $primary,
+		color: $primary,
+		hover-bg: $primary,
+		hover-color: $white,
+		btn-focus-box-shadow: 0 0 0 $btn-focus-width rgba($primary, 0.5),
+		btn-focus-outline: 0,
+		disabled-bg: transparent,
+		disabled-color: $primary,
+		disabled-cursor: $btn-disabled-cursor,
+		disabled-opacity: $btn-disabled-opacity,
+		active-bg: $primary,
+		active-color: $white,
+	),
+	$link-outline-primary
+);
 
 $link-outline-secondary: () !default;
-$link-outline-secondary: map-deep-merge((
-	border-color: $secondary,
-	color: $secondary,
-	hover-bg: $secondary,
-	hover-color: $white,
-	btn-focus-box-shadow: 0 0 0 $btn-focus-width rgba($secondary, 0.5),
-	btn-focus-outline: 0,
-	disabled-bg: transparent,
-	disabled-color: $secondary,
-	disabled-cursor: $btn-disabled-cursor,
-	disabled-opacity: $btn-disabled-opacity,
-	active-bg: $secondary,
-	active-color: $white,
-), $link-outline-secondary);
+$link-outline-secondary: map-deep-merge(
+	(
+		border-color: $secondary,
+		color: $secondary,
+		hover-bg: $secondary,
+		hover-color: $white,
+		btn-focus-box-shadow: 0 0 0 $btn-focus-width rgba($secondary, 0.5),
+		btn-focus-outline: 0,
+		disabled-bg: transparent,
+		disabled-color: $secondary,
+		disabled-cursor: $btn-disabled-cursor,
+		disabled-opacity: $btn-disabled-opacity,
+		active-bg: $secondary,
+		active-color: $white,
+	),
+	$link-outline-secondary
+);
 
 // Link Monospaced
 
@@ -118,80 +136,108 @@ $link-outline-secondary: map-deep-merge((
 $link-monospaced-size: $btn-monospaced-size-sm !default;
 
 $link-monospaced: () !default;
-$link-monospaced: map-deep-merge((
-	align-items: center,
-	display: inline-flex,
-	height: $link-monospaced-size,
-	justify-content: center,
-	overflow: hidden,
-	padding-bottom: 0,
-	padding-left: 0,
-	padding-right: 0,
-	padding-top: 0,
-	vertical-align: middle,
-	width: $link-monospaced-size,
-	lexicon-icon-margin-top: 0,
-), $link-monospaced);
+$link-monospaced: map-deep-merge(
+	(
+		align-items: center,
+		display: inline-flex,
+		height: $link-monospaced-size,
+		justify-content: center,
+		overflow: hidden,
+		padding-bottom: 0,
+		padding-left: 0,
+		padding-right: 0,
+		padding-top: 0,
+		vertical-align: middle,
+		width: $link-monospaced-size,
+		lexicon-icon-margin-top: 0,
+	),
+	$link-monospaced
+);
 
 // Component Title
 
 $component-title: () !default;
-$component-title: map-deep-merge((
-	color: $gray-900,
-	font-size: 1.125rem,
-	font-weight: $headings-font-weight,
-	line-height: $headings-line-height,
-	margin-bottom: calc((#{$dropdown-action-toggle-size} - (1em * #{$headings-line-height})) / 2),
-	margin-top: calc((#{$dropdown-action-toggle-size} - (1em * #{$headings-line-height})) / 2)
-), $component-title);
+$component-title: map-deep-merge(
+	(
+		color: $gray-900,
+		font-size: 1.125rem,
+		font-weight: $headings-font-weight,
+		line-height: $headings-line-height,
+		margin-bottom:
+			calc(
+				(
+						#{$dropdown-action-toggle-size} - (1em * #{$headings-line-height})
+					) / 2
+			),
+		margin-top:
+			calc(
+				(
+						#{$dropdown-action-toggle-size} - (1em * #{$headings-line-height})
+					) / 2
+			),
+	),
+	$component-title
+);
 
 $component-title-link: () !default;
-$component-title-link: map-deep-merge((
-	color: $gray-900,
-	hover-color: darken($gray-900, 15%)
-), $component-title-link);
+$component-title-link: map-deep-merge(
+	(
+		color: $gray-900,
+		hover-color: darken($gray-900, 15%),
+	),
+	$component-title-link
+);
 
 // Component Subtitle
 
 $component-subtitle: () !default;
-$component-subtitle: map-deep-merge((
-	color: $gray-600,
-	margin-bottom: 0
-), $component-subtitle);
+$component-subtitle: map-deep-merge(
+	(
+		color: $gray-600,
+		margin-bottom: 0,
+	),
+	$component-subtitle
+);
 
 $component-subtitle-link: () !default;
-$component-subtitle-link: map-deep-merge((
-	color: $gray-600,
-	hover-color: darken($gray-600, 15%)
-), $component-subtitle-link);
+$component-subtitle-link: map-deep-merge(
+	(
+		color: $gray-600,
+		hover-color: darken($gray-600, 15%),
+	),
+	$component-subtitle-link
+);
 
 // Component Action
 
 $component-action: () !default;
-$component-action: map-deep-merge((
-	align-items: center,
-	bg: transparent,
-	border-color: transparent,
-	border-radius: $border-radius,
-	border-width: 0,
-	color: $secondary,
-	display: inline-flex,
-	height: map-get($link-monospaced, height),
-	justify-content: center,
-	overflow: hidden,
-	padding: 0,
-	vertical-align: middle,
-	width: map-get($link-monospaced, width),
-	hover-bg: $secondary,
-	hover-color: $white,
-	btn-focus-box-shadow: 0 0 0 $btn-focus-width rgba($secondary, 0.5),
-	btn-focus-outline: 0,
-	active-bg: $secondary,
-	active-color: $white,
-	disabled-bg: transparent,
-	disabled-color: $secondary,
-	disabled-cursor: $disabled-cursor,
-	disabled-opacity: $btn-disabled-opacity,
-	transition: $btn-transition,
-	lexicon-icon-margin-top: 0,
-), $component-action);
+$component-action: map-deep-merge(
+	(
+		align-items: center,
+		bg: transparent,
+		border-color: transparent,
+		border-radius: $border-radius,
+		border-width: 0,
+		color: $secondary,
+		display: inline-flex,
+		height: map-get($link-monospaced, height),
+		justify-content: center,
+		overflow: hidden,
+		padding: 0,
+		vertical-align: middle,
+		width: map-get($link-monospaced, width),
+		hover-bg: $secondary,
+		hover-color: $white,
+		btn-focus-box-shadow: 0 0 0 $btn-focus-width rgba($secondary, 0.5),
+		btn-focus-outline: 0,
+		active-bg: $secondary,
+		active-color: $white,
+		disabled-bg: transparent,
+		disabled-color: $secondary,
+		disabled-cursor: $disabled-cursor,
+		disabled-opacity: $btn-disabled-opacity,
+		transition: $btn-transition,
+		lexicon-icon-margin-top: 0,
+	),
+	$component-action
+);
diff --git a/packages/clay-css/src/scss/variables/_list-group.scss b/packages/clay-css/src/scss/variables/_list-group.scss
index e9ecdd31b5..31d8c7b073 100644
--- a/packages/clay-css/src/scss/variables/_list-group.scss
+++ b/packages/clay-css/src/scss/variables/_list-group.scss
@@ -19,81 +19,108 @@ $list-group-header-padding-x: $list-group-item-padding-x !default;
 $list-group-header-padding-y: $list-group-item-padding-y !default;
 
 $list-group-header-title: () !default;
-$list-group-header-title: map-deep-merge((
-	font-size: 1rem,
-	font-weight: $font-weight-semi-bold,
-	line-height: $headings-line-height,
-	margin-bottom: 0
-), $list-group-header-title);
+$list-group-header-title: map-deep-merge(
+	(
+		font-size: 1rem,
+		font-weight: $font-weight-semi-bold,
+		line-height: $headings-line-height,
+		margin-bottom: 0,
+	),
+	$list-group-header-title
+);
 
 // List Group Title
 
 $list-group-title-link: () !default;
-$list-group-title-link: map-deep-merge((
-	color: $gray-900,
-	max-width: 100%,
-	hover-color: darken($gray-900, 15%)
-), $list-group-title-link);
+$list-group-title-link: map-deep-merge(
+	(
+		color: $gray-900,
+		max-width: 100%,
+		hover-color: darken($gray-900, 15%),
+	),
+	$list-group-title-link
+);
 
 $list-group-title: () !default;
-$list-group-title: map-deep-merge((
-	// 18px
-	font-size: 1.125rem,
-	font-weight: $font-weight-semi-bold,
-	line-height: $line-height-base,
-	margin-bottom: 0,
-	margin-top: $list-group-item-flex-list-group-title-offset-top,
-	clay-link: $list-group-title-link
-), $list-group-title);
+$list-group-title: map-deep-merge(
+	(
+		// 18px
+			font-size: 1.125rem,
+		font-weight: $font-weight-semi-bold,
+		line-height: $line-height-base,
+		margin-bottom: 0,
+		margin-top: $list-group-item-flex-list-group-title-offset-top,
+		clay-link: $list-group-title-link
+	),
+	$list-group-title
+);
 
 $list-group-title-active-color: $list-group-active-color !default;
 
 // List Group Subtitle
 
 $list-group-subtitle-link: () !default;
-$list-group-subtitle-link: map-deep-merge((
-	color: $gray-600,
-	hover-color: darken($gray-600, 15%)
-), $list-group-subtitle-link);
+$list-group-subtitle-link: map-deep-merge(
+	(
+		color: $gray-600,
+		hover-color: darken($gray-600, 15%),
+	),
+	$list-group-subtitle-link
+);
 
 $list-group-subtitle: () !default;
-$list-group-subtitle: map-deep-merge((
-	color: $gray-600,
-	margin-bottom: 0,
-	clay-link: $list-group-subtitle-link
-), $list-group-subtitle);
+$list-group-subtitle: map-deep-merge(
+	(
+		color: $gray-600,
+		margin-bottom: 0,
+		clay-link: $list-group-subtitle-link,
+	),
+	$list-group-subtitle
+);
 
 // List Group Text
 
 $list-group-text-link: () !default;
-$list-group-text-link: map-deep-merge((
-	color: $gray-900,
-	hover-color: darken($gray-900, 15%)
-), $list-group-text-link);
+$list-group-text-link: map-deep-merge(
+	(
+		color: $gray-900,
+		hover-color: darken($gray-900, 15%),
+	),
+	$list-group-text-link
+);
 
 $list-group-text: () !default;
-$list-group-text: map-deep-merge((
-	color: $gray-900,
-	margin-bottom: 0,
-	clay-link: $list-group-text-link
-), $list-group-text);
+$list-group-text: map-deep-merge(
+	(
+		color: $gray-900,
+		margin-bottom: 0,
+		clay-link: $list-group-text-link,
+	),
+	$list-group-text
+);
 
 $list-group-text-active-color: $list-group-active-color !default;
 
 // List Group Subtext
 
 $list-group-subtext-link: () !default;
-$list-group-subtext-link: map-deep-merge((
-	color: $gray-600,
-	hover-color: darken($gray-600, 15%)
-), $list-group-subtext-link);
+$list-group-subtext-link: map-deep-merge(
+	(
+		color: $gray-600,
+		hover-color: darken($gray-600, 15%),
+	),
+	$list-group-subtext-link
+);
 
 $list-group-subtext: () !default;
-$list-group-subtext: map-deep-merge((
-	color: $gray-600,
-	margin-bottom: 0,
-	clay-link: $list-group-subtext-link
-), $list-group-subtext);
+$list-group-subtext: map-deep-merge(
+	(
+		color: $gray-600,
+		margin-bottom: 0,
+		clay-link: $list-group-subtext-link,
+	),
+	$list-group-subtext
+);
 
 $list-group-subtext-active-color: $list-group-active-color !default;
 
@@ -126,26 +153,35 @@ $list-group-notification-item-border-top-width: 0.0625rem !default;
 $list-group-notification-item: () !default;
 
 $list-group-notification-item-primary: () !default;
-$list-group-notification-item-primary: map-deep-merge((
-	border-left-color: theme-color-level(primary, -9),
-	border-left-width: 0.5rem,
-	border-bottom-left-radius: 0,
-	border-top-left-radius: 0,
-	active-border-left-color: theme-color-level(primary, -9)
-), $list-group-notification-item-primary);
+$list-group-notification-item-primary: map-deep-merge(
+	(
+		border-left-color: theme-color-level(primary, -9),
+		border-left-width: 0.5rem,
+		border-bottom-left-radius: 0,
+		border-top-left-radius: 0,
+		active-border-left-color: theme-color-level(primary, -9),
+	),
+	$list-group-notification-item-primary
+);
 
 // List Group Sm
 
 $list-group-sm-item: () !default;
-$list-group-sm-item: map-deep-merge((
-	padding-bottom: 0.40625rem,
-	padding-top: 0.40625rem,
-), $list-group-sm-item);
+$list-group-sm-item: map-deep-merge(
+	(
+		padding-bottom: 0.40625rem,
+		padding-top: 0.40625rem,
+	),
+	$list-group-sm-item
+);
 
 $list-group-sm-quick-action-menu: () !default;
-$list-group-sm-quick-action-menu: map-deep-merge((
-	margin-bottom: -0.40625rem,
-	margin-top: -0.40625rem,
-	padding-bottom: 0.40625rem,
-	padding-top: 0.40625rem,
-), $list-group-sm-quick-action-menu);
\ No newline at end of file
+$list-group-sm-quick-action-menu: map-deep-merge(
+	(
+		margin-bottom: -0.40625rem,
+		margin-top: -0.40625rem,
+		padding-bottom: 0.40625rem,
+		padding-top: 0.40625rem,
+	),
+	$list-group-sm-quick-action-menu
+);
diff --git a/packages/clay-css/src/scss/variables/_loaders.scss b/packages/clay-css/src/scss/variables/_loaders.scss
index 9f2a12940d..ec1b49060c 100644
--- a/packages/clay-css/src/scss/variables/_loaders.scss
+++ b/packages/clay-css/src/scss/variables/_loaders.scss
@@ -5,13 +5,19 @@ $loading-icon-font-size-sm: 1.25rem !default; // 20px
 // Loading Icon Dotted
 
 $loading-animation: () !default;
-$loading-animation: map-deep-merge((
-	animation-name: loading-animation,
-	color: $gray-900,
-), $loading-animation);
+$loading-animation: map-deep-merge(
+	(
+		animation-name: loading-animation,
+		color: $gray-900,
+	),
+	$loading-animation
+);
 
 $loading-animation-light: () !default;
-$loading-animation-light: map-deep-merge((
-	animation-name: loading-animation-light,
-	color: $white
-), $loading-animation-light);
\ No newline at end of file
+$loading-animation-light: map-deep-merge(
+	(
+		animation-name: loading-animation-light,
+		color: $white,
+	),
+	$loading-animation-light
+);
diff --git a/packages/clay-css/src/scss/variables/_management-bar.scss b/packages/clay-css/src/scss/variables/_management-bar.scss
index c37434eb8d..a4944c58e2 100644
--- a/packages/clay-css/src/scss/variables/_management-bar.scss
+++ b/packages/clay-css/src/scss/variables/_management-bar.scss
@@ -1,44 +1,53 @@
 $management-bar-base: () !default;
 
 $management-bar-size: () !default;
-$management-bar-size: map-deep-merge((
-	scaling-navbar: true,
-	font-size: $navbar-font-size,
-	height: 4rem,
-	height-mobile: 3rem,
-	border-bottom-width: 0.0625rem,
-	padding-x: 0,
-	padding-y: 0,
-	btn-monospaced-font-size: 1rem,
-	link-height: 2rem,
-	link-height-mobile: 2rem,
-	link-margin-x: 0.5rem,
-	link-margin-x-mobile: 0.25rem,
-	link-padding-x-mobile: 0.25rem,
-	form-control-height-mobile: 2rem,
-	toggler-margin-x: 0.875rem,
-	active-border-bottom-width: 0.25rem,
-	nav-item-dropdown-margin-top: 0
-), $management-bar-size);
+$management-bar-size: map-deep-merge(
+	(
+		scaling-navbar: true,
+		font-size: $navbar-font-size,
+		height: 4rem,
+		height-mobile: 3rem,
+		border-bottom-width: 0.0625rem,
+		padding-x: 0,
+		padding-y: 0,
+		btn-monospaced-font-size: 1rem,
+		link-height: 2rem,
+		link-height-mobile: 2rem,
+		link-margin-x: 0.5rem,
+		link-margin-x-mobile: 0.25rem,
+		link-padding-x-mobile: 0.25rem,
+		form-control-height-mobile: 2rem,
+		toggler-margin-x: 0.875rem,
+		active-border-bottom-width: 0.25rem,
+		nav-item-dropdown-margin-top: 0,
+	),
+	$management-bar-size
+);
 
 $management-bar-light: () !default;
-$management-bar-light: map-deep-merge((
-	bg: $light,
-	link-color: $navbar-light-color,
-	link-hover-color: $navbar-light-hover-color,
-	link-active-color: $navbar-light-active-color,
-	link-disabled-color: $navbar-light-disabled-color,
-	link-disabled-opacity: 1
-), $management-bar-light);
+$management-bar-light: map-deep-merge(
+	(
+		bg: $light,
+		link-color: $navbar-light-color,
+		link-hover-color: $navbar-light-hover-color,
+		link-active-color: $navbar-light-active-color,
+		link-disabled-color: $navbar-light-disabled-color,
+		link-disabled-opacity: 1,
+	),
+	$management-bar-light
+);
 
 $management-bar-primary: () !default;
-$management-bar-primary: map-deep-merge((
-	bg: $primary-l3,
-	border-color: $primary,
-	color: $navbar-light-color,
-	link-color: $navbar-light-color,
-	link-hover-color: $navbar-light-hover-color,
-	link-active-color: $navbar-light-active-color,
-	link-disabled-color: $navbar-light-disabled-color,
-	link-disabled-opacity: 1
-), $management-bar-primary);
\ No newline at end of file
+$management-bar-primary: map-deep-merge(
+	(
+		bg: $primary-l3,
+		border-color: $primary,
+		color: $navbar-light-color,
+		link-color: $navbar-light-color,
+		link-hover-color: $navbar-light-hover-color,
+		link-active-color: $navbar-light-active-color,
+		link-disabled-color: $navbar-light-disabled-color,
+		link-disabled-opacity: 1,
+	),
+	$management-bar-primary
+);
diff --git a/packages/clay-css/src/scss/variables/_menubar.scss b/packages/clay-css/src/scss/variables/_menubar.scss
index 8d9bb5cac1..b927204a74 100644
--- a/packages/clay-css/src/scss/variables/_menubar.scss
+++ b/packages/clay-css/src/scss/variables/_menubar.scss
@@ -1,82 +1,134 @@
 // Menubar Vertical MD
 
 $menubar-vertical-expand-md: () !default;
-$menubar-vertical-expand-md: map-deep-merge((
-	margin-bottom-mobile: 1.5rem,
-	margin-left-mobile: -($grid-gutter-width / 2),
-	margin-right-mobile: -($grid-gutter-width / 2),
-	collapse-z-index-mobile: $zindex-menubar-vertical-expand-md-collapse-mobile,
-), $menubar-vertical-expand-md);
+$menubar-vertical-expand-md: map-deep-merge(
+	(
+		margin-bottom-mobile: 1.5rem,
+		margin-left-mobile: -
+			(
+				$grid-gutter-width / 2,
+			),
+		margin-right-mobile: -
+			(
+				$grid-gutter-width / 2,
+			),
+		collapse-z-index-mobile:
+			$zindex-menubar-vertical-expand-md-collapse-mobile,
+	),
+	$menubar-vertical-expand-md
+);
 
 $menubar-vertical-transparent-md: () !default;
-$menubar-vertical-transparent-md: map-deep-merge((
-	link-color: $gray-600,
-	link-hover-color: darken($gray-600, 15),
-	link-active-color: $gray-900,
-	bg-mobile: $gray-100,
-), $menubar-vertical-transparent-md);
+$menubar-vertical-transparent-md: map-deep-merge(
+	(
+		link-color: $gray-600,
+		link-hover-color: darken($gray-600, 15),
+		link-active-color: $gray-900,
+		bg-mobile: $gray-100,
+	),
+	$menubar-vertical-transparent-md
+);
 
 $menubar-vertical-decorated-md-nav: () !default;
-$menubar-vertical-decorated-md-nav: map-deep-merge((
-	border-left-color: $gray-300,
-	border-left-style: solid,
-	border-left-width: 0.125rem,
-	display: block,
-	padding-left: 0.5rem,
-), $menubar-vertical-decorated-md-nav);
+$menubar-vertical-decorated-md-nav: map-deep-merge(
+	(
+		border-left-color: $gray-300,
+		border-left-style: solid,
+		border-left-width: 0.125rem,
+		display: block,
+		padding-left: 0.5rem,
+	),
+	$menubar-vertical-decorated-md-nav
+);
 
 $menubar-vertical-decorated-md-nav-item-nav: () !default;
-$menubar-vertical-decorated-md-nav-item-nav: map-deep-merge((
-	margin-bottom: 0.25rem,
-	margin-left: 1rem,
-	margin-top: 0.25rem,
-), $menubar-vertical-decorated-md-nav-item-nav);
+$menubar-vertical-decorated-md-nav-item-nav: map-deep-merge(
+	(
+		margin-bottom: 0.25rem,
+		margin-left: 1rem,
+		margin-top: 0.25rem,
+	),
+	$menubar-vertical-decorated-md-nav-item-nav
+);
 
 $menubar-vertical-decorated-md-nav-link: () !default;
-$menubar-vertical-decorated-md-nav-link: map-deep-merge((
-	padding-left: 1rem !important,
-), $menubar-vertical-decorated-md-nav-link);
+$menubar-vertical-decorated-md-nav-link: map-deep-merge(
+	(
+		padding-left: 1rem !important,
+	),
+	$menubar-vertical-decorated-md-nav-link
+);
 
 $menubar-vertical-decorated-md-nav-link-after-active: () !default;
-$menubar-vertical-decorated-md-nav-link-after-active: map-deep-merge((
-	background-color: $primary-l2,
-	bottom: 0,
-	content: '',
-	display: block,
-	left: math-sign(map-get($menubar-vertical-decorated-md-nav, padding-left)) - map-get($menubar-vertical-decorated-md-nav, border-left-width),
-	position: absolute,
-	top: 0,
-	width: map-get($menubar-vertical-decorated-md-nav, border-left-width),
-), $menubar-vertical-decorated-md-nav-link-after-active);
+$menubar-vertical-decorated-md-nav-link-after-active: map-deep-merge(
+	(
+		background-color: $primary-l2,
+		bottom: 0,
+		content: '',
+		display: block,
+		left:
+			math-sign(map-get($menubar-vertical-decorated-md-nav, padding-left)) -
+			map-get($menubar-vertical-decorated-md-nav, border-left-width),
+		position: absolute,
+		top: 0,
+		width: map-get($menubar-vertical-decorated-md-nav, border-left-width),
+	),
+	$menubar-vertical-decorated-md-nav-link-after-active
+);
 
 // Menubar Vertical LG
 
 $menubar-vertical-expand-lg: () !default;
-$menubar-vertical-expand-lg: map-deep-merge((
-	breakpoint-up: lg,
-	margin-bottom-mobile: 1.5rem,
-	margin-left-mobile: -($grid-gutter-width / 2),
-	margin-right-mobile: -($grid-gutter-width / 2),
-	collapse-z-index-mobile: $zindex-menubar-vertical-expand-lg-collapse-mobile,
-), $menubar-vertical-expand-lg);
+$menubar-vertical-expand-lg: map-deep-merge(
+	(
+		breakpoint-up: lg,
+		margin-bottom-mobile: 1.5rem,
+		margin-left-mobile: -
+			(
+				$grid-gutter-width / 2,
+			),
+		margin-right-mobile: -
+			(
+				$grid-gutter-width / 2,
+			),
+		collapse-z-index-mobile:
+			$zindex-menubar-vertical-expand-lg-collapse-mobile,
+	),
+	$menubar-vertical-expand-lg
+);
 
 $menubar-vertical-transparent-lg: () !default;
-$menubar-vertical-transparent-lg: map-deep-merge((
-	breakpoint-up: lg,
-	link-color: $gray-600,
-	link-hover-color: darken($gray-600, 15),
-	link-active-color: $gray-900,
-	bg-mobile: $gray-100,
-), $menubar-vertical-transparent-lg);
+$menubar-vertical-transparent-lg: map-deep-merge(
+	(
+		breakpoint-up: lg,
+		link-color: $gray-600,
+		link-hover-color: darken($gray-600, 15),
+		link-active-color: $gray-900,
+		bg-mobile: $gray-100,
+	),
+	$menubar-vertical-transparent-lg
+);
 
 $menubar-vertical-decorated-lg-nav: () !default;
-$menubar-vertical-decorated-lg-nav: map-deep-merge($menubar-vertical-decorated-md-nav, $menubar-vertical-decorated-lg-nav);
+$menubar-vertical-decorated-lg-nav: map-deep-merge(
+	$menubar-vertical-decorated-md-nav,
+	$menubar-vertical-decorated-lg-nav
+);
 
 $menubar-vertical-decorated-lg-nav-item-nav: () !default;
-$menubar-vertical-decorated-lg-nav-item-nav: map-deep-merge($menubar-vertical-decorated-md-nav-item-nav, $menubar-vertical-decorated-lg-nav-item-nav);
+$menubar-vertical-decorated-lg-nav-item-nav: map-deep-merge(
+	$menubar-vertical-decorated-md-nav-item-nav,
+	$menubar-vertical-decorated-lg-nav-item-nav
+);
 
 $menubar-vertical-decorated-lg-nav-link: () !default;
-$menubar-vertical-decorated-lg-nav-link: map-deep-merge($menubar-vertical-decorated-md-nav-link, $menubar-vertical-decorated-lg-nav-link);
+$menubar-vertical-decorated-lg-nav-link: map-deep-merge(
+	$menubar-vertical-decorated-md-nav-link,
+	$menubar-vertical-decorated-lg-nav-link
+);
 
 $menubar-vertical-decorated-lg-nav-link-after-active: () !default;
-$menubar-vertical-decorated-lg-nav-link-after-active: map-deep-merge($menubar-vertical-decorated-md-nav-link-after-active, $menubar-vertical-decorated-lg-nav-link-after-active);
\ No newline at end of file
+$menubar-vertical-decorated-lg-nav-link-after-active: map-deep-merge(
+	$menubar-vertical-decorated-md-nav-link-after-active,
+	$menubar-vertical-decorated-lg-nav-link-after-active
+);
diff --git a/packages/clay-css/src/scss/variables/_modals.scss b/packages/clay-css/src/scss/variables/_modals.scss
index b79051bb5d..225ef79069 100644
--- a/packages/clay-css/src/scss/variables/_modals.scss
+++ b/packages/clay-css/src/scss/variables/_modals.scss
@@ -18,50 +18,68 @@ $modal-item-padding-x: null !default;
 $modal-item-padding-y: null !default;
 
 $modal-item-group: () !default;
-$modal-item-group: map-deep-merge((
-	align-items: center,
-	display: flex,
-	flex-wrap: wrap,
-	min-width: 3rem,
-	padding-left: 0.5rem,
-	padding-right: 0.5rem,
-	width: 100%,
-), $modal-item-group);
+$modal-item-group: map-deep-merge(
+	(
+		align-items: center,
+		display: flex,
+		flex-wrap: wrap,
+		min-width: 3rem,
+		padding-left: 0.5rem,
+		padding-right: 0.5rem,
+		width: 100%,
+	),
+	$modal-item-group
+);
 
 $modal-item-group-first-child: () !default;
-$modal-item-group-first-child: map-deep-merge((
-	padding-left: 0,
-), $modal-item-group-first-child);
+$modal-item-group-first-child: map-deep-merge(
+	(
+		padding-left: 0,
+	),
+	$modal-item-group-first-child
+);
 
 $modal-item-group-last-child: () !default;
-$modal-item-group-last-child: map-deep-merge((
-	padding-right: 0,
-), $modal-item-group-last-child);
+$modal-item-group-last-child: map-deep-merge(
+	(
+		padding-right: 0,
+	),
+	$modal-item-group-last-child
+);
 
 $modal-item-group-only-child: () !default;
-$modal-item-group-only-child: map-deep-merge((
-	padding-left: 0,
-	padding-right: 0,
-), $modal-item-group-only-child);
+$modal-item-group-only-child: map-deep-merge(
+	(
+		padding-left: 0,
+		padding-right: 0,
+	),
+	$modal-item-group-only-child
+);
 
 $modal-item: () !default;
-$modal-item: map-deep-merge((
-	display: flex,
-	flex-direction: column,
-	flex-grow: 1,
-	flex-shrink: 1,
-	max-width: 100%,
-	min-height: 0,
-	min-width: 3.125rem,
-	padding: 0,
-	position: relative,
-	word-wrap: break-word,
-), $modal-item);
+$modal-item: map-deep-merge(
+	(
+		display: flex,
+		flex-direction: column,
+		flex-grow: 1,
+		flex-shrink: 1,
+		max-width: 100%,
+		min-height: 0,
+		min-width: 3.125rem,
+		padding: 0,
+		position: relative,
+		word-wrap: break-word,
+	),
+	$modal-item
+);
 
 $modal-item-shrink: () !default;
-$modal-item-shrink: map-deep-merge((
-	flex-grow: 0,
-), $modal-item-shrink);
+$modal-item-shrink: map-deep-merge(
+	(
+		flex-grow: 0,
+	),
+	$modal-item-shrink
+);
 
 // Modal Title
 
@@ -76,16 +94,22 @@ $modal-title-indicator-spacer-x: 0.5rem !default; // 8px
 // Modal Subtitle
 
 $modal-subtitle: () !default;
-$modal-subtitle: map-deep-merge((
-	display: inline-block,
-), $modal-subtitle);
+$modal-subtitle: map-deep-merge(
+	(
+		display: inline-block,
+	),
+	$modal-subtitle
+);
 
 $modal-subtitle-divider: () !default;
-$modal-subtitle-divider: map-deep-merge((
-	display: inline-block,
-	margin-left: 0.25rem,
-	margin-right: 0.25rem,
-), $modal-subtitle-divider);
+$modal-subtitle-divider: map-deep-merge(
+	(
+		display: inline-block,
+		margin-left: 0.25rem,
+		margin-right: 0.25rem,
+	),
+	$modal-subtitle-divider
+);
 
 $modal-subtitle-strong: () !default;
 
@@ -106,86 +130,107 @@ $modal-height-lg: 650px !default;
 $modal-height-xl: 800px !default;
 
 $modal-height-full-modal-content: () !default;
-$modal-height-full-modal-content: map-merge((
-	position: absolute,
-	bottom: $modal-dialog-margin,
-	left: $modal-dialog-margin,
-	right: $modal-dialog-margin,
-	top: $modal-dialog-margin,
-), $modal-height-full-modal-content);
+$modal-height-full-modal-content: map-merge(
+	(
+		position: absolute,
+		bottom: $modal-dialog-margin,
+		left: $modal-dialog-margin,
+		right: $modal-dialog-margin,
+		top: $modal-dialog-margin,
+	),
+	$modal-height-full-modal-content
+);
 
 $modal-height-full-modal-content-sm-up: () !default;
-$modal-height-full-modal-content-sm-up: map-merge((
-	bottom: $modal-dialog-margin-y-sm-up,
-	left: auto,
-	right: auto,
-	top: $modal-dialog-margin-y-sm-up,
-), $modal-height-full-modal-content-sm-up);
+$modal-height-full-modal-content-sm-up: map-merge(
+	(
+		bottom: $modal-dialog-margin-y-sm-up,
+		left: auto,
+		right: auto,
+		top: $modal-dialog-margin-y-sm-up,
+	),
+	$modal-height-full-modal-content-sm-up
+);
 
 // Modal Success
 
 $modal-success: () !default;
-$modal-success: map-deep-merge((
-	header-bg: theme-color-level(success, -10),
-	header-border-color: theme-color-level(success, -9),
-	header-color: theme-color-level(success, 6),
-	header-close: (
-		color: theme-color-level(success, 6),
-		hover-color: inherit,
-		focus-color: inherit,
-		disabled-color: inherit
-	)
-), $modal-success);
+$modal-success: map-deep-merge(
+	(
+		header-bg: theme-color-level(success, -10),
+		header-border-color: theme-color-level(success, -9),
+		header-color: theme-color-level(success, 6),
+		header-close: (
+			color: theme-color-level(success, 6),
+			hover-color: inherit,
+			focus-color: inherit,
+			disabled-color: inherit,
+		),
+	),
+	$modal-success
+);
 
 // Modal Info
 
 $modal-info: () !default;
-$modal-info: map-deep-merge((
-	header-bg: theme-color-level(info, -10),
-	header-border-color: theme-color-level(info, -9),
-	header-color: theme-color-level(info, 6),
-	header-close: (
-		color: theme-color-level(info, 6),
-		hover-color: inherit,
-		focus-color: inherit,
-		disabled-color: inherit
-	)
-), $modal-info);
+$modal-info: map-deep-merge(
+	(
+		header-bg: theme-color-level(info, -10),
+		header-border-color: theme-color-level(info, -9),
+		header-color: theme-color-level(info, 6),
+		header-close: (
+			color: theme-color-level(info, 6),
+			hover-color: inherit,
+			focus-color: inherit,
+			disabled-color: inherit,
+		),
+	),
+	$modal-info
+);
 
 // Modal Warning
 
 $modal-warning: () !default;
-$modal-warning: map-deep-merge((
-	header-bg: theme-color-level(warning, -10),
-	header-border-color: theme-color-level(warning, -9),
-	header-color: theme-color-level(warning, 6),
-	header-close: (
-		color: theme-color-level(warning, 6),
-		hover-color: inherit,
-		focus-color: inherit,
-		disabled-color: inherit
-	)
-), $modal-warning);
+$modal-warning: map-deep-merge(
+	(
+		header-bg: theme-color-level(warning, -10),
+		header-border-color: theme-color-level(warning, -9),
+		header-color: theme-color-level(warning, 6),
+		header-close: (
+			color: theme-color-level(warning, 6),
+			hover-color: inherit,
+			focus-color: inherit,
+			disabled-color: inherit,
+		),
+	),
+	$modal-warning
+);
 
 // Modal Danger
 
 $modal-danger: () !default;
-$modal-danger: map-deep-merge((
-	header-bg: theme-color-level(danger, -10),
-	header-border-color: theme-color-level(danger, -9),
-	header-color: theme-color-level(danger, 6),
-	header-close: (
-		color: theme-color-level(danger, 6),
-		hover-color: inherit,
-		focus-color: inherit,
-		disabled-color: inherit
-	)
-), $modal-danger);
+$modal-danger: map-deep-merge(
+	(
+		header-bg: theme-color-level(danger, -10),
+		header-border-color: theme-color-level(danger, -9),
+		header-color: theme-color-level(danger, 6),
+		header-close: (
+			color: theme-color-level(danger, 6),
+			hover-color: inherit,
+			focus-color: inherit,
+			disabled-color: inherit,
+		),
+	),
+	$modal-danger
+);
 
 $modal-palette: () !default;
-$modal-palette: map-deep-merge((
-	success: $modal-success,
-	info: $modal-info,
-	warning: $modal-warning,
-	danger: $modal-danger
-), $modal-palette);
\ No newline at end of file
+$modal-palette: map-deep-merge(
+	(
+		success: $modal-success,
+		info: $modal-info,
+		warning: $modal-warning,
+		danger: $modal-danger,
+	),
+	$modal-palette
+);
diff --git a/packages/clay-css/src/scss/variables/_multi-step-nav.scss b/packages/clay-css/src/scss/variables/_multi-step-nav.scss
index 59a67d85c6..a540dc881b 100644
--- a/packages/clay-css/src/scss/variables/_multi-step-nav.scss
+++ b/packages/clay-css/src/scss/variables/_multi-step-nav.scss
@@ -31,9 +31,11 @@ $multi-step-icon-focus-text-decoration: $multi-step-icon-hover-text-decoration !
 $multi-step-divider-bg: $gray-200 !default;
 $multi-step-divider-height: 0.25rem !default;
 $multi-step-divider-spacer-x: 0 !default;
-$multi-step-divider-top: ($multi-step-divider-height / 2) + ($multi-step-icon-size / 2) !default;
+$multi-step-divider-top: ($multi-step-divider-height / 2) +
+	($multi-step-icon-size / 2) !default;
 
-$multi-step-indicator-width: $multi-step-icon-size + ($multi-step-divider-spacer-x * 2) !default;
+$multi-step-indicator-width: $multi-step-icon-size +
+	($multi-step-divider-spacer-x * 2) !default;
 
 $multi-step-indicator-label-color: null !default;
 $multi-step-indicator-label-font-size: $font-size-base !default;
@@ -52,11 +54,17 @@ $multi-step-item-fixed-width: 150px !default;
 
 $multi-step-icon-complete-color: $white !default;
 $multi-step-icon-complete-bg: $gray-600 !default;
-$multi-step-icon-complete-bg-image: clay-icon(check, $multi-step-icon-complete-color) !default;
+$multi-step-icon-complete-bg-image: clay-icon(
+	check,
+	$multi-step-icon-complete-color
+) !default;
 $multi-step-icon-complete-bg-position: center !default;
 $multi-step-icon-complete-bg-size: $multi-step-icon-font-size !default;
 $multi-step-divider-complete-bg: $multi-step-icon-complete-bg !default;
-$multi-step-dropdown-indicator-complete-icon: clay-icon(check, $dropdown-link-active-color) !default;
+$multi-step-dropdown-indicator-complete-icon: clay-icon(
+	check,
+	$dropdown-link-active-color
+) !default;
 $multi-step-dropdown-indicator-complete-width: 0.875rem !default;
 
 $multi-step-icon-active-color: $component-active-color !default;
@@ -76,4 +84,4 @@ $multi-step-icon-disabled-opacity: 1 !default;
 $multi-step-icon-disabled-focus-box-shadow: none !default;
 $multi-step-divider-disabled-bg: $multi-step-icon-disabled-bg !default;
 $multi-step-title-disabled-color: $multi-step-icon-disabled-color !default;
-$multi-step-indicator-label-disabled-color: $multi-step-title-disabled-color !default;
\ No newline at end of file
+$multi-step-indicator-label-disabled-color: $multi-step-title-disabled-color !default;
diff --git a/packages/clay-css/src/scss/variables/_navbar.scss b/packages/clay-css/src/scss/variables/_navbar.scss
index baa42b2753..888f8432bc 100644
--- a/packages/clay-css/src/scss/variables/_navbar.scss
+++ b/packages/clay-css/src/scss/variables/_navbar.scss
@@ -13,4 +13,4 @@ $navbar-title-text-transform: null !default;
 $navbar-text-truncate-spacer-right: 1.5625rem !default; // 25px
 $navbar-text-truncate-max-width: 12.5rem !default; // 200px
 
-$navbar-toggler-cursor: null !default;
\ No newline at end of file
+$navbar-toggler-cursor: null !default;
diff --git a/packages/clay-css/src/scss/variables/_navigation-bar.scss b/packages/clay-css/src/scss/variables/_navigation-bar.scss
index ba19706e6f..dc0b952581 100644
--- a/packages/clay-css/src/scss/variables/_navigation-bar.scss
+++ b/packages/clay-css/src/scss/variables/_navigation-bar.scss
@@ -1,39 +1,48 @@
 $navigation-bar-size: () !default;
-$navigation-bar-size: map-deep-merge((
-	scaling-navbar: false,
-	border-bottom-width: 0.0625rem,
-	font-size: $navbar-font-size,
-	height: 3rem,
-	padding-x: 0,
-	padding-y: 0,
-	link-padding-x: 1rem,
-	collapse-dropdown-item-padding-x-mobile: 1rem,
-	collapse-dropdown-item-padding-y-mobile: 0.71875rem,
-	nav-item-dropdown-margin-top: 0,
-	active-border-bottom-width: 0.25rem
-), $navigation-bar-size);
+$navigation-bar-size: map-deep-merge(
+	(
+		scaling-navbar: false,
+		border-bottom-width: 0.0625rem,
+		font-size: $navbar-font-size,
+		height: 3rem,
+		padding-x: 0,
+		padding-y: 0,
+		link-padding-x: 1rem,
+		collapse-dropdown-item-padding-x-mobile: 1rem,
+		collapse-dropdown-item-padding-y-mobile: 0.71875rem,
+		nav-item-dropdown-margin-top: 0,
+		active-border-bottom-width: 0.25rem,
+	),
+	$navigation-bar-size
+);
 
 $navigation-bar-base: () !default;
 
 $navigation-bar-light: () !default;
-$navigation-bar-light: map-deep-merge((
-	bg: $light,
-	link-color: $navbar-light-color,
-	link-hover-color: $navbar-light-hover-color,
-	link-active-color: $navbar-light-active-color,
-	link-disabled-color: $navbar-light-disabled-color,
-	link-disabled-opacity: 1
-), $navigation-bar-light);
+$navigation-bar-light: map-deep-merge(
+	(
+		bg: $light,
+		link-color: $navbar-light-color,
+		link-hover-color: $navbar-light-hover-color,
+		link-active-color: $navbar-light-active-color,
+		link-disabled-color: $navbar-light-disabled-color,
+		link-disabled-opacity: 1,
+	),
+	$navigation-bar-light
+);
 
 $navigation-bar-secondary: () !default;
-$navigation-bar-secondary: map-deep-merge((
-	bg: $secondary,
-	color: $white,
-	link-color: rgba(255, 255, 255, 0.65),
-	link-hover-color: rgba(255, 255, 255, 0.9),
-	link-active-color: rgba(255, 255, 255, 0.9),
-	link-disabled-color: rgba(255, 255, 255, 0.25),
-	link-disabled-opacity: 1,
-	brand-color: rgba(255, 255, 255, 0.9),
-	brand-hover-color: rgba(255, 255, 255, 0.9)
-), $navigation-bar-secondary);
\ No newline at end of file
+$navigation-bar-secondary: map-deep-merge(
+	(
+		bg: $secondary,
+		color: $white,
+		link-color: rgba(255, 255, 255, 0.65),
+		link-hover-color: rgba(255, 255, 255, 0.9),
+		link-active-color: rgba(255, 255, 255, 0.9),
+		link-disabled-color: rgba(255, 255, 255, 0.25),
+		link-disabled-opacity: 1,
+		brand-color: rgba(255, 255, 255, 0.9),
+		brand-hover-color: rgba(255, 255, 255, 0.9),
+	),
+	$navigation-bar-secondary
+);
diff --git a/packages/clay-css/src/scss/variables/_navs.scss b/packages/clay-css/src/scss/variables/_navs.scss
index be43960d73..1b82edbf28 100644
--- a/packages/clay-css/src/scss/variables/_navs.scss
+++ b/packages/clay-css/src/scss/variables/_navs.scss
@@ -3,28 +3,34 @@ $nav-font-size: null !default;
 $nav-link-disabled-cursor: $disabled-cursor !default;
 
 $nav-link: () !default;
-$nav-link: map-deep-merge((
-	display: block,
-	padding-bottom: $nav-link-padding-y,
-	padding-left: $nav-link-padding-x,
-	padding-right: $nav-link-padding-x,
-	padding-top: $nav-link-padding-y,
-	position: relative,
-	focus-z-index: 1,
-	disabled-color: $nav-link-disabled-color,
-	disabled-cursor: $nav-link-disabled-cursor,
-	disabled-pointer-events: auto,
-	disabled-active-pointer-events: none,
-), $nav-link);
+$nav-link: map-deep-merge(
+	(
+		display: block,
+		padding-bottom: $nav-link-padding-y,
+		padding-left: $nav-link-padding-x,
+		padding-right: $nav-link-padding-x,
+		padding-top: $nav-link-padding-y,
+		position: relative,
+		focus-z-index: 1,
+		disabled-color: $nav-link-disabled-color,
+		disabled-cursor: $nav-link-disabled-cursor,
+		disabled-pointer-events: auto,
+		disabled-active-pointer-events: none,
+	),
+	$nav-link
+);
 
 $nav-link-btn-unstyled: () !default;
-$nav-link-btn-unstyled: map-deep-merge((
-	width: 100%,
-	disabled-opacity: 1,
-	c-inner: (
-		width: auto,
+$nav-link-btn-unstyled: map-deep-merge(
+	(
+		width: 100%,
+		disabled-opacity: 1,
+		c-inner: (
+			width: auto,
+		),
 	),
-), $nav-link-btn-unstyled);
+	$nav-link-btn-unstyled
+);
 
 $nav-item-monospaced-size: 2rem !default; // 32px
 
@@ -34,7 +40,10 @@ $nav-btn-margin-x: 0.25rem !default; // 4px
 
 /// @deprecated after v3.4.0 use the Sass map `$nav-btn` instead
 
-$nav-btn-margin-y: (($line-height-base * $font-size-base) + ($nav-link-padding-y * 2) - $nav-item-monospaced-size) / 2 !default;
+$nav-btn-margin-y: (
+		($line-height-base * $font-size-base) + ($nav-link-padding-y * 2) -
+			$nav-item-monospaced-size
+	) / 2 !default;
 
 /// @deprecated after v3.4.0 use the Sass map `$nav-btn` instead
 
@@ -45,49 +54,58 @@ $nav-btn-padding-x: $btn-padding-x-sm !default;
 $nav-btn-padding-y: 0 !default;
 
 $nav-btn: () !default;
-$nav-btn: map-deep-merge((
-	align-items: center,
-	display: flex,
-	height: $nav-item-monospaced-size,
-	justify-content: center,
-	line-height: $line-height-base,
-	margin: $nav-btn-margin-y $nav-btn-margin-x,
-	min-width: $nav-item-monospaced-size,
-	padding: $nav-btn-padding-y $nav-btn-padding-x,
-	position: relative,
-	text-align: center,
-	width: auto,
-	focus-z-index: 1,
-	disabled-opacity: 1,
-	c-inner: (
-		margin-bottom: 0,
-		margin-left: math-sign($nav-btn-padding-x),
-		margin-right: math-sign($nav-btn-padding-x),
-		margin-top: math-sign($btn-border-width),
+$nav-btn: map-deep-merge(
+	(
+		align-items: center,
+		display: flex,
+		height: $nav-item-monospaced-size,
+		justify-content: center,
+		line-height: $line-height-base,
+		margin: $nav-btn-margin-y $nav-btn-margin-x,
+		min-width: $nav-item-monospaced-size,
+		padding: $nav-btn-padding-y $nav-btn-padding-x,
+		position: relative,
+		text-align: center,
+		width: auto,
+		focus-z-index: 1,
+		disabled-opacity: 1,
+		c-inner: (
+			margin-bottom: 0,
+			margin-left: math-sign($nav-btn-padding-x),
+			margin-right: math-sign($nav-btn-padding-x),
+			margin-top: math-sign($btn-border-width),
+		),
+		lexicon-icon-margin-top: 0,
 	),
-	lexicon-icon-margin-top: 0,
-), $nav-btn);
+	$nav-btn
+);
 
 $nav-btn-monospaced: () !default;
-$nav-btn-monospaced: map-deep-merge((
-	padding: 0,
-	c-inner: (
-		margin-left: math-sign($btn-border-width),
-		margin-right: math-sign($btn-border-width),
+$nav-btn-monospaced: map-deep-merge(
+	(
+		padding: 0,
+		c-inner: (
+			margin-left: math-sign($btn-border-width),
+			margin-right: math-sign($btn-border-width),
+		),
 	),
-), $nav-btn-monospaced);
+	$nav-btn-monospaced
+);
 
 $nav-link-monospaced: () !default;
-$nav-link-monospaced: map-deep-merge((
-	align-items: center,
-	display: flex,
-	height: $nav-item-monospaced-size,
-	justify-content: center,
-	margin: $nav-btn-margin-y $nav-btn-margin-x,
-	min-width: $nav-item-monospaced-size,
-	padding: 0,
-	lexicon-icon-margin-top: 0,
-), $nav-link-monospaced);
+$nav-link-monospaced: map-deep-merge(
+	(
+		align-items: center,
+		display: flex,
+		height: $nav-item-monospaced-size,
+		justify-content: center,
+		margin: $nav-btn-margin-y $nav-btn-margin-x,
+		min-width: $nav-item-monospaced-size,
+		padding: 0,
+		lexicon-icon-margin-top: 0,
+	),
+	$nav-link-monospaced
+);
 
 $nav-form-padding-bottom: 0 !default;
 $nav-form-padding-left: $nav-link-padding-x !default;
@@ -117,15 +135,18 @@ $nav-tabs-link-padding-x: null !default;
 $nav-tabs-link-padding-y: null !default;
 
 $nav-tabs-link: () !default;
-$nav-tabs-link: map-deep-merge((
-	border-radius: $nav-tabs-border-radius $nav-tabs-border-radius 0 0,
-	color: $nav-tabs-link-color,
-	padding-bottom: $nav-tabs-link-padding-y,
-	padding-left: $nav-tabs-link-padding-x,
-	padding-right: $nav-tabs-link-padding-x,
-	padding-top: $nav-tabs-link-padding-y,
-	white-space: nowrap,
-), $nav-tabs-link);
+$nav-tabs-link: map-deep-merge(
+	(
+		border-radius: $nav-tabs-border-radius $nav-tabs-border-radius 0 0,
+		color: $nav-tabs-link-color,
+		padding-bottom: $nav-tabs-link-padding-y,
+		padding-left: $nav-tabs-link-padding-x,
+		padding-right: $nav-tabs-link-padding-x,
+		padding-top: $nav-tabs-link-padding-y,
+		white-space: nowrap,
+	),
+	$nav-tabs-link
+);
 
 // Nav Tabs Link Show
 
@@ -134,11 +155,14 @@ $nav-tabs-link-show-bg: null !default;
 $nav-tabs-link-show-border-color: null !default;
 
 $nav-tabs-link-show: () !default;
-$nav-tabs-link-show: map-deep-merge((
-	bg: $nav-tabs-link-show-bg,
-	border-color: $nav-tabs-link-show-border-color,
-	color: $nav-tabs-link-show-color,
-), $nav-tabs-link-show);
+$nav-tabs-link-show: map-deep-merge(
+	(
+		bg: $nav-tabs-link-show-bg,
+		border-color: $nav-tabs-link-show-border-color,
+		color: $nav-tabs-link-show-color,
+	),
+	$nav-tabs-link-show
+);
 
 // Nav Tabs Tab Pane
 
@@ -163,22 +187,28 @@ $nav-underline-link-active-color: null !default;
 $nav-underline-link-disabled-color: null !default;
 
 $nav-underline-link: () !default;
-$nav-underline-link: map-deep-merge((
-	color: $nav-underline-link-color,
-	padding-bottom: $nav-underline-link-padding-y,
-	padding-left: $nav-underline-link-padding-x,
-	padding-right: $nav-underline-link-padding-x,
-	padding-top: $nav-underline-link-padding-y,
-	hover-color: $nav-underline-link-hover-color,
-	focus-color: $nav-underline-link-hover-color,
-	active-class-color: $nav-underline-link-active-color,
-	disabled-color: $nav-underline-link-disabled-color,
-), $nav-underline-link);
+$nav-underline-link: map-deep-merge(
+	(
+		color: $nav-underline-link-color,
+		padding-bottom: $nav-underline-link-padding-y,
+		padding-left: $nav-underline-link-padding-x,
+		padding-right: $nav-underline-link-padding-x,
+		padding-top: $nav-underline-link-padding-y,
+		hover-color: $nav-underline-link-hover-color,
+		focus-color: $nav-underline-link-hover-color,
+		active-class-color: $nav-underline-link-active-color,
+		disabled-color: $nav-underline-link-disabled-color,
+	),
+	$nav-underline-link
+);
 
 $nav-underline-link-show: () !default;
-$nav-underline-link-show: map-deep-merge((
-	color: $nav-underline-link-active-color,
-), $nav-underline-link-show);
+$nav-underline-link-show: map-deep-merge(
+	(
+		color: $nav-underline-link-active-color,
+	),
+	$nav-underline-link-show
+);
 
 // Nav Underline Link Highlight
 
@@ -193,4 +223,4 @@ $nav-underline-link-active-highlight: $component-active-bg !default;
 $nav-underline-link-active-content: '' !default;
 $nav-underline-link-active-highlight-height: 0.1875rem !default;
 
-$nav-underline-link-disabled-highlight: null !default;
\ No newline at end of file
+$nav-underline-link-disabled-highlight: null !default;
diff --git a/packages/clay-css/src/scss/variables/_pagination.scss b/packages/clay-css/src/scss/variables/_pagination.scss
index a301a49e3b..35d0d25de2 100644
--- a/packages/clay-css/src/scss/variables/_pagination.scss
+++ b/packages/clay-css/src/scss/variables/_pagination.scss
@@ -17,12 +17,15 @@ $pagination-item-margin-x: -0.5px !default;
 $pagination-item-margin-y: null !default;
 
 $pagination-item: () !default;
-$pagination-item: map-deep-merge((
-	margin-bottom: $pagination-item-margin-y,
-	margin-left: $pagination-item-margin-x,
-	margin-right: $pagination-item-margin-x,
-	margin-top: $pagination-item-margin-y,
-), $pagination-item);
+$pagination-item: map-deep-merge(
+	(
+		margin-bottom: $pagination-item-margin-y,
+		margin-left: $pagination-item-margin-x,
+		margin-right: $pagination-item-margin-x,
+		margin-top: $pagination-item-margin-y,
+	),
+	$pagination-item
+);
 
 // Pagination Link
 
@@ -60,58 +63,73 @@ $pagination-disabled-pointer-events: auto !default;
 // Pagination Link
 
 $pagination-link: () !default;
-$pagination-link: map-deep-merge((
-	align-items: center,
-	bg: $pagination-bg,
-	border-radius: $pagination-link-border-radius,
-	border-width: $pagination-border-width,
-	cursor: $pagination-link-cursor,
-	display: inline-flex,
-	height: $pagination-item-height,
-	justify-content: center,
-	line-height: $pagination-line-height,
-	margin-left: 0,
-	padding-bottom: $pagination-padding-y,
-	padding-left: $pagination-padding-x,
-	padding-right: $pagination-padding-x,
-	padding-top: $pagination-padding-y,
-	transition: $pagination-link-transition,
-	lexicon-icon-margin-top: 0,
-), $pagination-link);
+$pagination-link: map-deep-merge(
+	(
+		align-items: center,
+		bg: $pagination-bg,
+		border-radius: $pagination-link-border-radius,
+		border-width: $pagination-border-width,
+		cursor: $pagination-link-cursor,
+		display: inline-flex,
+		height: $pagination-item-height,
+		justify-content: center,
+		line-height: $pagination-line-height,
+		margin-left: 0,
+		padding-bottom: $pagination-padding-y,
+		padding-left: $pagination-padding-x,
+		padding-right: $pagination-padding-x,
+		padding-top: $pagination-padding-y,
+		transition: $pagination-link-transition,
+		lexicon-icon-margin-top: 0,
+	),
+	$pagination-link
+);
 
 $pagination-link-hover: () !default;
-$pagination-link-hover: map-deep-merge((
-	bg: $pagination-hover-bg,
-	border-color: $pagination-hover-border-color,
-	color: $pagination-hover-color,
-), $pagination-link-hover);
+$pagination-link-hover: map-deep-merge(
+	(
+		bg: $pagination-hover-bg,
+		border-color: $pagination-hover-border-color,
+		color: $pagination-hover-color,
+	),
+	$pagination-link-hover
+);
 
 $pagination-link-focus: () !default;
-$pagination-link-focus: map-deep-merge((
-	box-shadow: $pagination-focus-box-shadow,
-	z-index: $zindex-pagination-link-focus,
-), $pagination-link-focus);
+$pagination-link-focus: map-deep-merge(
+	(
+		box-shadow: $pagination-focus-box-shadow,
+		z-index: $zindex-pagination-link-focus,
+	),
+	$pagination-link-focus
+);
 
 $pagination-link-active: () !default;
-$pagination-link-active: map-deep-merge((
-	bg: $pagination-active-bg,
-	border-color: $pagination-active-border-color,
-	cursor: default,
-	color: $pagination-active-color,
-	z-index: $zindex-pagination-link-active,
-), $pagination-link-active);
+$pagination-link-active: map-deep-merge(
+	(
+		bg: $pagination-active-bg,
+		border-color: $pagination-active-border-color,
+		cursor: default,
+		color: $pagination-active-color,
+		z-index: $zindex-pagination-link-active,
+	),
+	$pagination-link-active
+);
 
 $pagination-link-disabled: () !default;
-$pagination-link-disabled: map-deep-merge((
-	bg: $pagination-disabled-bg,
-	border-color: $pagination-disabled-border-color,
-	box-shadow: none,
-	color: $pagination-disabled-color,
-	cursor: $pagination-disabled-cursor,
-	opacity: $pagination-disabled-opacity,
-	pointer-events: $pagination-disabled-pointer-events,
-	z-index: $zindex-pagination-link-disabled,
-), $pagination-link-disabled);
+$pagination-link-disabled: map-deep-merge(
+	(
+		bg: $pagination-disabled-bg,
+		border-color: $pagination-disabled-border-color,
+		box-shadow: none,
+		color: $pagination-disabled-color,
+		cursor: $pagination-disabled-cursor,
+		opacity: $pagination-disabled-opacity,
+		pointer-events: $pagination-disabled-pointer-events,
+		z-index: $zindex-pagination-link-disabled,
+	),
+	$pagination-link-disabled
+);
 
 // Pagination Dropdown Menu
 
@@ -171,58 +189,75 @@ $pagination-items-per-page-lexicon-icon-margin-top: 0.125rem !default; // 2px
 // Pagination Items Per Page Link
 
 $pagination-items-per-page-link: () !default;
-$pagination-items-per-page-link: map-deep-merge((
-	align-items: center,
-	bg: $pagination-items-per-page-bg,
-	border-color: $pagination-items-per-page-border-color,
-	border-radius: $pagination-items-per-page-border-radius,
-	border-style: solid,
-	border-width: $pagination-border-width,
-	color: $pagination-items-per-page-color,
-	display: inline-flex,
-	height: $pagination-item-height,
-	justify-content: center,
-	line-height: $pagination-line-height,
-	padding-bottom: $pagination-padding-y,
-	padding-left: $pagination-padding-x,
-	padding-right: $pagination-padding-x,
-	padding-top: $pagination-padding-y,
-	text-decoration: none,
-	transition: $pagination-items-per-page-transition,
-	lexicon-icon-margin-left: $pagination-items-per-page-lexicon-icon-margin-left,
-	lexicon-icon-margin-top: $pagination-items-per-page-lexicon-icon-margin-top,
-), $pagination-items-per-page-link);
+$pagination-items-per-page-link: map-deep-merge(
+	(
+		align-items: center,
+		bg: $pagination-items-per-page-bg,
+		border-color: $pagination-items-per-page-border-color,
+		border-radius: $pagination-items-per-page-border-radius,
+		border-style: solid,
+		border-width: $pagination-border-width,
+		color: $pagination-items-per-page-color,
+		display: inline-flex,
+		height: $pagination-item-height,
+		justify-content: center,
+		line-height: $pagination-line-height,
+		padding-bottom: $pagination-padding-y,
+		padding-left: $pagination-padding-x,
+		padding-right: $pagination-padding-x,
+		padding-top: $pagination-padding-y,
+		text-decoration: none,
+		transition: $pagination-items-per-page-transition,
+		lexicon-icon-margin-left:
+			$pagination-items-per-page-lexicon-icon-margin-left,
+		lexicon-icon-margin-top:
+			$pagination-items-per-page-lexicon-icon-margin-top,
+	),
+	$pagination-items-per-page-link
+);
 
 $pagination-items-per-page-link-hover: () !default;
-$pagination-items-per-page-link-hover: map-deep-merge((
-	bg: $pagination-items-per-page-hover-bg,
-	border-color: $pagination-items-per-page-hover-border-color,
-	color: $pagination-items-per-page-hover-color,
-), $pagination-items-per-page-link-hover);
+$pagination-items-per-page-link-hover: map-deep-merge(
+	(
+		bg: $pagination-items-per-page-hover-bg,
+		border-color: $pagination-items-per-page-hover-border-color,
+		color: $pagination-items-per-page-hover-color,
+	),
+	$pagination-items-per-page-link-hover
+);
 
 $pagination-items-per-page-link-focus: () !default;
-$pagination-items-per-page-link-focus: map-deep-merge((
-	box-shadow: $pagination-items-per-page-focus-box-shadow,
-	outline: $pagination-items-per-page-focus-outline,
-), $pagination-items-per-page-link-focus);
+$pagination-items-per-page-link-focus: map-deep-merge(
+	(
+		box-shadow: $pagination-items-per-page-focus-box-shadow,
+		outline: $pagination-items-per-page-focus-outline,
+	),
+	$pagination-items-per-page-link-focus
+);
 
 $pagination-items-per-page-link-active: () !default;
-$pagination-items-per-page-link-active: map-deep-merge((
-	bg: $pagination-active-bg,
-	border-color: $pagination-active-border-color,
-	color: $pagination-active-color,
-), $pagination-items-per-page-link-active);
+$pagination-items-per-page-link-active: map-deep-merge(
+	(
+		bg: $pagination-active-bg,
+		border-color: $pagination-active-border-color,
+		color: $pagination-active-color,
+	),
+	$pagination-items-per-page-link-active
+);
 
 $pagination-items-per-page-link-disabled: () !default;
-$pagination-items-per-page-link-disabled: map-deep-merge((
-	bg: $pagination-disabled-bg,
-	border-color: $pagination-disabled-border-color,
-	box-shadow: none,
-	color: $pagination-disabled-color,
-	cursor: $pagination-disabled-cursor,
-	opacity: $pagination-disabled-opacity,
-	pointer-events: $pagination-disabled-pointer-events,
-), $pagination-items-per-page-link-disabled);
+$pagination-items-per-page-link-disabled: map-deep-merge(
+	(
+		bg: $pagination-disabled-bg,
+		border-color: $pagination-disabled-border-color,
+		box-shadow: none,
+		color: $pagination-disabled-color,
+		cursor: $pagination-disabled-cursor,
+		opacity: $pagination-disabled-opacity,
+		pointer-events: $pagination-disabled-pointer-events,
+	),
+	$pagination-items-per-page-link-disabled
+);
 
 // Pagination Results
 
@@ -244,4 +279,4 @@ $pagination-line-height-lg: 1 !default;
 $pagination-link-border-radius-lg: null !default;
 
 $pagination-items-per-page-lexicon-icon-margin-left-lg: null !default;
-$pagination-items-per-page-lexicon-icon-margin-top-lg: null !default;
\ No newline at end of file
+$pagination-items-per-page-lexicon-icon-margin-top-lg: null !default;
diff --git a/packages/clay-css/src/scss/variables/_panels.scss b/packages/clay-css/src/scss/variables/_panels.scss
index 4ca5c39550..e4e6a560b8 100644
--- a/packages/clay-css/src/scss/variables/_panels.scss
+++ b/packages/clay-css/src/scss/variables/_panels.scss
@@ -6,7 +6,8 @@ $panel-border-bottom-width: 1px !default;
 $panel-border-left-width: 1px !default;
 $panel-border-right-width: 1px !default;
 $panel-border-top-width: 1px !default;
-$panel-border-width: $panel-border-top-width $panel-border-right-width $panel-border-bottom-width $panel-border-left-width !default;
+$panel-border-width: $panel-border-top-width $panel-border-right-width
+	$panel-border-bottom-width $panel-border-left-width !default;
 
 $panel-border-radius: $border-radius !default;
 $panel-box-shadow: null !default;
@@ -15,7 +16,11 @@ $panel-margin-bottom: $spacer !default;
 // Panel Header
 
 $panel-header-border-bottom-width: 1px !default;
-$panel-header-offset-border-radius: if($panel-border-top-width > 0, calc(#{$panel-border-radius} - #{$panel-border-top-width}), $panel-border-radius) !default;
+$panel-header-offset-border-radius: if(
+	$panel-border-top-width > 0,
+	calc(#{$panel-border-radius} - #{$panel-border-top-width}),
+	$panel-border-radius
+) !default;
 $panel-header-font-size: $font-size-base !default;
 $panel-header-line-height: $headings-line-height !default;
 $panel-header-padding-x: 1.25rem !default;
@@ -25,7 +30,12 @@ $panel-header-collapse-icon-font-size: 0.875rem !default; // 14px
 $panel-header-collapse-icon-bottom: null !default;
 $panel-header-collapse-icon-left: null !default;
 $panel-header-collapse-icon-right: null !default;
-$panel-header-collapse-icon-top: clay-collapse-icon-align($panel-header-padding-y, 0, 1em, $panel-header-line-height) !default;
+$panel-header-collapse-icon-top: clay-collapse-icon-align(
+	$panel-header-padding-y,
+	0,
+	1em,
+	$panel-header-line-height
+) !default;
 
 $panel-header-collapse-icon-padding-left: null !default;
 $panel-header-collapse-icon-padding-right: null !default;
@@ -34,21 +44,27 @@ $panel-header-link-text-decoration: null !default;
 $panel-header-link-hover-text-decoration: null !default;
 
 $panel-header-link: () !default;
-$panel-header-link: map-deep-merge((
-	color: inherit,
-	display: block,
-	text-decoration: $panel-header-link-text-decoration,
-	transition: border-color 0.1s ease#{','} border-radius 0.5s ease,
-	hover-color: inherit,
-	hover-text-decoration: $panel-header-link-hover-text-decoration,
-	focus-z-index: $zindex-panel-header-link-focus,
-), $panel-header-link);
+$panel-header-link: map-deep-merge(
+	(
+		color: inherit,
+		display: block,
+		text-decoration: $panel-header-link-text-decoration,
+		transition: border-color 0.1s ease#{','} border-radius 0.5s ease,
+		hover-color: inherit,
+		hover-text-decoration: $panel-header-link-hover-text-decoration,
+		focus-z-index: $zindex-panel-header-link-focus,
+	),
+	$panel-header-link
+);
 
 $panel-header-collapsed-link: () !default;
-$panel-header-collapsed-link: map-deep-merge((
-	border-color: transparent,
-	transition: border-color 0.75s ease,
-), $panel-header-collapsed-link);
+$panel-header-collapsed-link: map-deep-merge(
+	(
+		border-color: transparent,
+		transition: border-color 0.75s ease,
+	),
+	$panel-header-collapsed-link
+);
 
 // Panel Body
 
@@ -58,7 +74,11 @@ $panel-body-padding-y: 0.75rem !default;
 // Panel Footer
 
 $panel-footer-border-top-width: 1px !default;
-$panel-footer-offset-border-radius: if($panel-border-bottom-width > 0, calc(#{$panel-border-radius} - #{$panel-border-bottom-width}), $panel-border-radius) !default;
+$panel-footer-offset-border-radius: if(
+	$panel-border-bottom-width > 0,
+	calc(#{$panel-border-radius} - #{$panel-border-bottom-width}),
+	$panel-border-radius
+) !default;
 $panel-footer-padding-x: $panel-header-padding-x !default;
 $panel-footer-padding-y: $panel-header-padding-y !default;
 
@@ -80,13 +100,16 @@ $panel-group-panel-margin-bottom: -$panel-border-bottom-width !default;
 // Panel Group Sm
 
 $panel-group-sm: () !default;
-$panel-group-sm: map-deep-merge((
-	font-size: 0.875rem,
-	header-padding-bottom: 0.5rem,
-	header-padding-top: 0.5rem,
-	title-font-size: 0.875rem,
-	collapse-icon-top: 0.6875rem,
-), $panel-group-sm);
+$panel-group-sm: map-deep-merge(
+	(
+		font-size: 0.875rem,
+		header-padding-bottom: 0.5rem,
+		header-padding-top: 0.5rem,
+		title-font-size: 0.875rem,
+		collapse-icon-top: 0.6875rem,
+	),
+	$panel-group-sm
+);
 
 // Panel Group Flush
 
@@ -103,30 +126,36 @@ $panel-group-flush-collapse-icon-padding-right: 1.5rem !default;
 $panel-secondary-header-link: () !default;
 
 $panel-secondary: () !default;
-$panel-secondary: map-deep-merge((
-	border-color: rgba($black, 0.125),
-	header-bg: $gray-100,
-	header-border-color: rgba($black, 0.125),
-	header-link: $panel-secondary-header-link,
-	footer-bg: $gray-100,
-	footer-border-color: rgba($black, 0.125)
-), $panel-secondary);
+$panel-secondary: map-deep-merge(
+	(
+		border-color: rgba($black, 0.125),
+		header-bg: $gray-100,
+		header-border-color: rgba($black, 0.125),
+		header-link: $panel-secondary-header-link,
+		footer-bg: $gray-100,
+		footer-border-color: rgba($black, 0.125),
+	),
+	$panel-secondary
+);
 
 // Panel Unstyled
 
 $panel-unstyled-header-link: () !default;
 
 $panel-unstyled: () !default;
-$panel-unstyled: map-deep-merge((
-	bg: transparent,
-	border-radius: 0,
-	border-width: 0,
-	header-border-color: $gray-500,
-	header-border-style: solid,
-	header-border-width: 0 0 1px 0,
-	header-margin-bottom: 1rem,
-	header-collapsed-border-color: $gray-500,
-	header-link: $panel-unstyled-header-link,
-	body-margin-bottom: 1rem,
-	body-padding-top: 0,
-), $panel-unstyled);
\ No newline at end of file
+$panel-unstyled: map-deep-merge(
+	(
+		bg: transparent,
+		border-radius: 0,
+		border-width: 0,
+		header-border-color: $gray-500,
+		header-border-style: solid,
+		header-border-width: 0 0 1px 0,
+		header-margin-bottom: 1rem,
+		header-collapsed-border-color: $gray-500,
+		header-link: $panel-unstyled-header-link,
+		body-margin-bottom: 1rem,
+		body-padding-top: 0,
+	),
+	$panel-unstyled
+);
diff --git a/packages/clay-css/src/scss/variables/_popovers.scss b/packages/clay-css/src/scss/variables/_popovers.scss
index 1ad0ba89ba..a78ebe0cd2 100644
--- a/packages/clay-css/src/scss/variables/_popovers.scss
+++ b/packages/clay-css/src/scss/variables/_popovers.scss
@@ -21,4 +21,6 @@ $popover-header-font-weight: $font-weight-semi-bold !default;
 $popover-header-margin-x: null !default;
 $popover-header-margin-y: null !default;
 
-$popover-offset-border-width: calc(#{$popover-border-radius} - #{$popover-border-width}) !default;
\ No newline at end of file
+$popover-offset-border-width: calc(
+	#{$popover-border-radius} - #{$popover-border-width}
+) !default;
diff --git a/packages/clay-css/src/scss/variables/_progress-bars.scss b/packages/clay-css/src/scss/variables/_progress-bars.scss
index c8b4e63809..4db85746ec 100644
--- a/packages/clay-css/src/scss/variables/_progress-bars.scss
+++ b/packages/clay-css/src/scss/variables/_progress-bars.scss
@@ -36,21 +36,24 @@ $progress-bar-warning-bg: $warning !default;
 $progress-group-feedback-warning-color: $progress-bar-warning-bg !default;
 
 $progress-palette: () !default;
-$progress-palette: map-deep-merge((
-	success: (
-		bar-bg: $progress-bar-success-bg,
-		group-feedback-color: $progress-group-feedback-success-color
+$progress-palette: map-deep-merge(
+	(
+		success: (
+			bar-bg: $progress-bar-success-bg,
+			group-feedback-color: $progress-group-feedback-success-color,
+		),
+		info: (
+			bar-bg: $progress-bar-info-bg,
+			group-feedback-color: $progress-group-feedback-info-color,
+		),
+		warning: (
+			bar-bg: $progress-bar-warning-bg,
+			group-feedback-color: $progress-group-feedback-warning-color,
+		),
+		danger: (
+			bar-bg: $progress-bar-danger-bg,
+			group-feedback-color: $progress-group-feedback-danger-color,
+		),
 	),
-	info: (
-		bar-bg: $progress-bar-info-bg,
-		group-feedback-color: $progress-group-feedback-info-color
-	),
-	warning: (
-		bar-bg: $progress-bar-warning-bg,
-		group-feedback-color: $progress-group-feedback-warning-color
-	),
-	danger: (
-		bar-bg: $progress-bar-danger-bg,
-		group-feedback-color: $progress-group-feedback-danger-color
-	)
-), $progress-palette);
\ No newline at end of file
+	$progress-palette
+);
diff --git a/packages/clay-css/src/scss/variables/_quick-action.scss b/packages/clay-css/src/scss/variables/_quick-action.scss
index 2f6b1c5737..cf03cbb394 100644
--- a/packages/clay-css/src/scss/variables/_quick-action.scss
+++ b/packages/clay-css/src/scss/variables/_quick-action.scss
@@ -13,4 +13,4 @@ $quick-action-item-min-width: 2rem !default; // 32px
 $quick-action-item-border-radius: $border-radius !default;
 
 $quick-action-item-disabled-cursor: $disabled-cursor !default;
-$quick-action-item-disabled-opacity: 0.65 !default;
\ No newline at end of file
+$quick-action-item-disabled-opacity: 0.65 !default;
diff --git a/packages/clay-css/src/scss/variables/_range.scss b/packages/clay-css/src/scss/variables/_range.scss
index 9cb4d12141..341969093e 100644
--- a/packages/clay-css/src/scss/variables/_range.scss
+++ b/packages/clay-css/src/scss/variables/_range.scss
@@ -1,92 +1,107 @@
 $clay-range-disabled-color: $gray-600 !default;
 
 $clay-range-input-group: () !default;
-$clay-range-input-group: map-deep-merge((
-	align-items: center,
-), $clay-range-input-group);
+$clay-range-input-group: map-deep-merge(
+	(
+		align-items: center,
+	),
+	$clay-range-input-group
+);
 
 $clay-range-input-group-item: () !default;
-$clay-range-input-group-item: map-deep-merge((
-	flex-direction: column,
-), $clay-range-input-group-item);
+$clay-range-input-group-item: map-deep-merge(
+	(
+		flex-direction: column,
+	),
+	$clay-range-input-group-item
+);
 
 $clay-range-input-group-text: () !default;
-$clay-range-input-group-text: map-deep-merge((
-	bg: transparent,
-	border-width: 0,
-	color: $body-color,
-	font-size: 0.875rem,
-	font-weight: $font-weight-semi-bold,
-	min-width: 1.5rem,
-	padding-bottom: 0,
-	padding-left: 0,
-	padding-right: 0,
-	padding-top: 0,
-), $clay-range-input-group-text);
+$clay-range-input-group-text: map-deep-merge(
+	(
+		bg: transparent,
+		border-width: 0,
+		color: $body-color,
+		font-size: 0.875rem,
+		font-weight: $font-weight-semi-bold,
+		min-width: 1.5rem,
+		padding-bottom: 0,
+		padding-left: 0,
+		padding-right: 0,
+		padding-top: 0,
+	),
+	$clay-range-input-group-text
+);
 
 $clay-range-title: () !default;
-$clay-range-title: map-deep-merge((
-	display: block,
-	font-weight: $font-weight-semi-bold,
-	line-height: 1,
-	margin-bottom: 0.5rem,
-	text-align: center,
-), $clay-range-title);
+$clay-range-title: map-deep-merge(
+	(
+		display: block,
+		font-weight: $font-weight-semi-bold,
+		line-height: 1,
+		margin-bottom: 0.5rem,
+		text-align: center,
+	),
+	$clay-range-title
+);
 
 $clay-range-input: () !default;
-$clay-range-input: map-deep-merge((
-	display: block,
-	padding-bottom: 0.1px,
-	position: relative,
-	vertical-align: middle,
-	width: 100%,
-	thumb-appearance: none,
-	thumb-bg: $white,
-	thumb-border-radius: 100px,
-	thumb-border-width: 0,
-	thumb-box-shadow: 0 1px 5px -1px rgba(0, 0, 0, 0.3),
-	thumb-height: 1.5rem,
-	thumb-width: 1.5rem,
-	track-appearance: none,
-	track-bg: $gray-300,
-	track-border-radius: 100px,
-	track-height: 0.25rem,
-	track-position: absolute,
-	track-top: 50%,
-	track-width: 100%,
-	progress-bg: $primary,
-	progress-border-radius: 100px 0 0 100px,
-	progress-position: absolute,
-	progress-top: 50%,
-	progress-width: 50%,
-	tooltip-padding: 0.25rem 0.5rem,
-	tooltip-spacer-y: 0.25rem,
-	tooltip-transition: opacity 0.15s linear,
-	tooltip-visibility: hidden,
-	tooltip-white-space: nowrap,
-	tooltip-arrow-size: 0.375rem,
-	form-control-appearance: none,
-	form-control-bg: transparent,
-	form-control-height: $input-height,
-	form-control-position: relative,
-	form-control-z-index: $zindex-clay-range-input-form-control,
-	data-label-font-size: 0.875rem,
-	data-label-font-weight: $font-weight-semi-bold,
-	data-label-line-height: 1,
-	data-label-margin-top: 2.5rem,
-	data-label-position: absolute,
-	data-label-spacer: 1rem,
-	data-label-text-align: center,
-	data-label-top: 0,
-	data-label-width: 1.5rem,
-	data-label-before-content: attr(data-label-min),
-	data-label-after-content: attr(data-label-max),
-	data-label-after-right: 0,
-	hover-cursor: $link-cursor,
-	focus-outline: 0,
-	focus-thumb-box-shadow: $component-focus-inset-box-shadow,
-	disabled-color: $clay-range-disabled-color,
-	disabled-cursor: $disabled-cursor,
-	disabled-progress-bg: $primary-l2,
-	disabled-track-bg: $gray-200,
-), $clay-range-input);
\ No newline at end of file
+$clay-range-input: map-deep-merge(
+	(
+		display: block,
+		padding-bottom: 0.1px,
+		position: relative,
+		vertical-align: middle,
+		width: 100%,
+		thumb-appearance: none,
+		thumb-bg: $white,
+		thumb-border-radius: 100px,
+		thumb-border-width: 0,
+		thumb-box-shadow: 0 1px 5px -1px rgba(0, 0, 0, 0.3),
+		thumb-height: 1.5rem,
+		thumb-width: 1.5rem,
+		track-appearance: none,
+		track-bg: $gray-300,
+		track-border-radius: 100px,
+		track-height: 0.25rem,
+		track-position: absolute,
+		track-top: 50%,
+		track-width: 100%,
+		progress-bg: $primary,
+		progress-border-radius: 100px 0 0 100px,
+		progress-position: absolute,
+		progress-top: 50%,
+		progress-width: 50%,
+		tooltip-padding: 0.25rem 0.5rem,
+		tooltip-spacer-y: 0.25rem,
+		tooltip-transition: opacity 0.15s linear,
+		tooltip-visibility: hidden,
+		tooltip-white-space: nowrap,
+		tooltip-arrow-size: 0.375rem,
+		form-control-appearance: none,
+		form-control-bg: transparent,
+		form-control-height: $input-height,
+		form-control-position: relative,
+		form-control-z-index: $zindex-clay-range-input-form-control,
+		data-label-font-size: 0.875rem,
+		data-label-font-weight: $font-weight-semi-bold,
+		data-label-line-height: 1,
+		data-label-margin-top: 2.5rem,
+		data-label-position: absolute,
+		data-label-spacer: 1rem,
+		data-label-text-align: center,
+		data-label-top: 0,
+		data-label-width: 1.5rem,
+		data-label-before-content: attr(data-label-min),
+		data-label-after-content: attr(data-label-max),
+		data-label-after-right: 0,
+		hover-cursor: $link-cursor,
+		focus-outline: 0,
+		focus-thumb-box-shadow: $component-focus-inset-box-shadow,
+		disabled-color: $clay-range-disabled-color,
+		disabled-cursor: $disabled-cursor,
+		disabled-progress-bg: $primary-l2,
+		disabled-track-bg: $gray-200,
+	),
+	$clay-range-input
+);
diff --git a/packages/clay-css/src/scss/variables/_reorder.scss b/packages/clay-css/src/scss/variables/_reorder.scss
index 5f40321ea6..14bb7d3654 100644
--- a/packages/clay-css/src/scss/variables/_reorder.scss
+++ b/packages/clay-css/src/scss/variables/_reorder.scss
@@ -1,56 +1,80 @@
 $clay-reorder: () !default;
-$clay-reorder: map-deep-merge((
-	padding: 2px,
-	position: relative,
-	z-index: 0,
-), $clay-reorder);
+$clay-reorder: map-deep-merge(
+	(
+		padding: 2px,
+		position: relative,
+		z-index: 0,
+	),
+	$clay-reorder
+);
 
 $clay-reorder-input-inset: () !default;
-$clay-reorder-input-inset: map-deep-merge((
-	margin-bottom: 0,
-	margin-top: 0,
-	overflow: auto,
-	padding-bottom: $input-padding-y,
-	padding-top: $input-padding-y,
-	focus: (
-		background-color: transparent,
-		box-shadow: none,
-	),
-), $clay-reorder-input-inset);
+$clay-reorder-input-inset: map-deep-merge(
+	(
+		margin-bottom: 0,
+		margin-top: 0,
+		overflow: auto,
+		padding-bottom: $input-padding-y,
+		padding-top: $input-padding-y,
+		focus: (
+			background-color: transparent,
+			box-shadow: none,
+		),
+	),
+	$clay-reorder-input-inset
+);
 
 $clay-reorder-underlay: () !default;
-$clay-reorder-underlay: map-deep-merge((
-	bottom: 0,
-	left: 0,
-	position: absolute,
-	right: 0,
-	top: 0,
-	z-index: -1,
-), $clay-reorder-underlay);
+$clay-reorder-underlay: map-deep-merge(
+	(
+		bottom: 0,
+		left: 0,
+		position: absolute,
+		right: 0,
+		top: 0,
+		z-index: -1,
+	),
+	$clay-reorder-underlay
+);
 
 $clay-reorder-underlay-focus: () !default;
-$clay-reorder-underlay-focus: map-deep-merge((
-	background-color: $input-focus-bg,
-	border-color: $input-focus-border-color,
-	box-shadow: $input-focus-box-shadow,
-), $clay-reorder-underlay-focus);
+$clay-reorder-underlay-focus: map-deep-merge(
+	(
+		background-color: $input-focus-bg,
+		border-color: $input-focus-border-color,
+		box-shadow: $input-focus-box-shadow,
+	),
+	$clay-reorder-underlay-focus
+);
 
 $clay-reorder-footer: () !default;
-$clay-reorder-footer: map-deep-merge((
-	padding: 0.5rem,
-), $clay-reorder-footer);
+$clay-reorder-footer: map-deep-merge(
+	(
+		padding: 0.5rem,
+	),
+	$clay-reorder-footer
+);
 
 $clay-reorder-footer-invisible: () !default;
-$clay-reorder-footer-invisible: map-deep-merge((
-	visibility: hidden,
-), $clay-reorder-footer-invisible);
+$clay-reorder-footer-invisible: map-deep-merge(
+	(
+		visibility: hidden,
+	),
+	$clay-reorder-footer-invisible
+);
 
 $clay-reorder-footer-center: () !default;
-$clay-reorder-footer-center: map-deep-merge((
-	text-align: center,
-), $clay-reorder-footer-center);
+$clay-reorder-footer-center: map-deep-merge(
+	(
+		text-align: center,
+	),
+	$clay-reorder-footer-center
+);
 
 $clay-reorder-footer-end: () !default;
-$clay-reorder-footer-end: map-deep-merge((
-	text-align: right,
-), $clay-reorder-footer-end);
+$clay-reorder-footer-end: map-deep-merge(
+	(
+		text-align: right,
+	),
+	$clay-reorder-footer-end
+);
diff --git a/packages/clay-css/src/scss/variables/_sheets.scss b/packages/clay-css/src/scss/variables/_sheets.scss
index 7ada1dad41..1509a275d0 100644
--- a/packages/clay-css/src/scss/variables/_sheets.scss
+++ b/packages/clay-css/src/scss/variables/_sheets.scss
@@ -45,16 +45,21 @@ $sheet-footer-margin-right-mobile: null !default;
 $sheet-footer-margin-top-mobile: null !default;
 
 $sheet-footer-btn-block-sm-down: () !default;
-$sheet-footer-btn-block-sm-down: map-deep-merge((
-	breakpoint-down: sm,
-	btn-margin-bottom-mobile: 1rem
-), $sheet-footer-btn-block-sm-down);
+$sheet-footer-btn-block-sm-down: map-deep-merge(
+	(
+		breakpoint-down: sm,
+		btn-margin-bottom-mobile: 1rem,
+	),
+	$sheet-footer-btn-block-sm-down
+);
 
 // Sheet Sizes
 
 /// @deprecated as of 3.x.
 
-$sheet-lg-max-width: ceil(map-get($container-max-widths, lg) * 0.83333) !default; // 800px
+$sheet-lg-max-width: ceil(
+	map-get($container-max-widths, lg) * 0.83333
+) !default; // 800px
 
 // Sheet Title
 
@@ -95,18 +100,26 @@ $sheet-subtitle-link-hover-color: null !default;
 $sheet-subtitle-link-hover-text-decoration: none !default;
 
 $sheet-subtitle-link: () !default;
-$sheet-subtitle-link: map-deep-merge((
-	color: $sheet-subtitle-link-color,
-	text-decoration: $sheet-subtitle-link-text-decoration,
-	hover-color: $sheet-subtitle-link-hover-color,
-	hover-text-decoration: $sheet-subtitle-link-hover-text-decoration,
-), $sheet-subtitle-link);
+$sheet-subtitle-link: map-deep-merge(
+	(
+		color: $sheet-subtitle-link-color,
+		text-decoration: $sheet-subtitle-link-text-decoration,
+		hover-color: $sheet-subtitle-link-hover-color,
+		hover-text-decoration: $sheet-subtitle-link-hover-text-decoration,
+	),
+	$sheet-subtitle-link
+);
 
 $sheet-subtitle-collapse-icon-font-size: null !default;
 $sheet-subtitle-collapse-icon-bottom: null !default;
 $sheet-subtitle-collapse-icon-left: null !default;
 $sheet-subtitle-collapse-icon-right: null !default;
-$sheet-subtitle-collapse-icon-top: clay-collapse-icon-align($sheet-subtitle-padding-y, 0, 1em, $sheet-subtitle-line-height) !default;
+$sheet-subtitle-collapse-icon-top: clay-collapse-icon-align(
+	$sheet-subtitle-padding-y,
+	0,
+	1em,
+	$sheet-subtitle-line-height
+) !default;
 
 $sheet-subtitle-collapse-icon-padding-left: null !default;
 $sheet-subtitle-collapse-icon-padding-right: null !default;
@@ -133,4 +146,4 @@ $sheet-text-font-weight: null !default;
 $sheet-text-margin-bottom: 1.5rem !default; // 24px
 
 $sheet-text-font-size-mobile: null !default;
-$sheet-text-margin-bottom-mobile: null !default;
\ No newline at end of file
+$sheet-text-margin-bottom-mobile: null !default;
diff --git a/packages/clay-css/src/scss/variables/_side-navigation.scss b/packages/clay-css/src/scss/variables/_side-navigation.scss
index d306c70fb2..0617212069 100644
--- a/packages/clay-css/src/scss/variables/_side-navigation.scss
+++ b/packages/clay-css/src/scss/variables/_side-navigation.scss
@@ -1,2 +1,2 @@
 $sidenav-transition: all 0.5s ease !default;
-$sidenav-width: 320px !default;
\ No newline at end of file
+$sidenav-width: 320px !default;
diff --git a/packages/clay-css/src/scss/variables/_sidebar.scss b/packages/clay-css/src/scss/variables/_sidebar.scss
index be1bc63918..13669db841 100644
--- a/packages/clay-css/src/scss/variables/_sidebar.scss
+++ b/packages/clay-css/src/scss/variables/_sidebar.scss
@@ -6,40 +6,52 @@ $sidebar-padding-top: 1rem !default; // 16px
 // Sidebar Header Title
 
 $sidebar-header-component-title: () !default;
-$sidebar-header-component-title: map-deep-merge((
-	font-size: 1.5rem,
-	font-weight: $font-weight-semi-bold,
-	clay-link: (
-		color: $gray-900
-	)
-), $sidebar-header-component-title);
+$sidebar-header-component-title: map-deep-merge(
+	(
+		font-size: 1.5rem,
+		font-weight: $font-weight-semi-bold,
+		clay-link: (
+			color: $gray-900,
+		),
+	),
+	$sidebar-header-component-title
+);
 
 // Sidebar Header Subtitle
 
 $sidebar-header-component-subtitle: () !default;
-$sidebar-header-component-subtitle: map-deep-merge((
-	font-size: 1.125rem,
-	font-weight: $font-weight-semi-bold,
-	margin-bottom: 0
-), $sidebar-header-component-subtitle);
+$sidebar-header-component-subtitle: map-deep-merge(
+	(
+		font-size: 1.125rem,
+		font-weight: $font-weight-semi-bold,
+		margin-bottom: 0,
+	),
+	$sidebar-header-component-subtitle
+);
 
 // Sidebar DT
 
 $sidebar-dt: () !default;
-$sidebar-dt: map-deep-merge((
-	font-size: 0.875rem,
-	font-weight: $font-weight-semi-bold,
-	margin-bottom: 0.25rem,
-	text-transform: uppercase
-), $sidebar-dt);
+$sidebar-dt: map-deep-merge(
+	(
+		font-size: 0.875rem,
+		font-weight: $font-weight-semi-bold,
+		margin-bottom: 0.25rem,
+		text-transform: uppercase,
+	),
+	$sidebar-dt
+);
 
 // Sidebar DD
 
 $sidebar-dd: () !default;
-$sidebar-dd: map-deep-merge((
-	font-size: 0.875rem,
-	margin-bottom: 0.75rem,
-), $sidebar-dd);
+$sidebar-dd: map-deep-merge(
+	(
+		font-size: 0.875rem,
+		margin-bottom: 0.75rem,
+	),
+	$sidebar-dd
+);
 
 // Sidebar Panel
 
@@ -58,73 +70,85 @@ $sidebar-list-group-autofit-col-padding-x: 0.5rem !default; // 8px
 $sidebar-list-group-autofit-col-padding-y: 1rem !default; // 16px
 
 $sidebar-list-group-sticker-size: () !default;
-$sidebar-list-group-sticker-size: map-deep-merge($sticker-sm, $sidebar-list-group-sticker-size);
+$sidebar-list-group-sticker-size: map-deep-merge(
+	$sticker-sm,
+	$sidebar-list-group-sticker-size
+);
 
 // Sidebar Light
 
 $sidebar-light: () !default;
-$sidebar-light: map-deep-merge((
-	bg: $light,
-	border-color: $gray-300,
-	border-left-width: 1px,
-	color: $gray-900,
-	dd: (
-		clay-link: (
-			color: $gray-900,
-		)
+$sidebar-light: map-deep-merge(
+	(
+		bg: $light,
+		border-color: $gray-300,
+		border-left-width: 1px,
+		color: $gray-900,
+		dd: (
+			clay-link: (
+				color: $gray-900,
+			),
+		),
+		panel-bg: $gray-200,
+		sidebar-list-group-title: (
+			font-size: 1rem,
+			clay-link: (
+				color: $gray-900,
+			),
+		),
 	),
-	panel-bg: $gray-200,
-	sidebar-list-group-title: (
-		font-size: 1rem,
-		clay-link: (
-			color: $gray-900,
-		)
-	)
-), $sidebar-light);
+	$sidebar-light
+);
 
 $sidebar-light-navigation-bar: () !default;
-$sidebar-light-navigation-bar: map-deep-merge((
-	bg: $light,
-	border-color: $gray-300,
-	link-color: $navbar-light-color,
-	link-hover-color: $navbar-light-hover-color,
-	link-active-color: $navbar-light-active-color,
-	link-disabled-color: $navbar-light-disabled-color
-), $sidebar-light-navigation-bar);
+$sidebar-light-navigation-bar: map-deep-merge(
+	(
+		bg: $light,
+		border-color: $gray-300,
+		link-color: $navbar-light-color,
+		link-hover-color: $navbar-light-hover-color,
+		link-active-color: $navbar-light-active-color,
+		link-disabled-color: $navbar-light-disabled-color,
+	),
+	$sidebar-light-navigation-bar
+);
 
 // Sidebar Dark
 
 $sidebar-dark: () !default;
-$sidebar-dark: map-deep-merge((
-	bg: $dark,
-	color: $white,
-	component-header-title: (
-		color: inherit,
-		clay-link: (
+$sidebar-dark: map-deep-merge(
+	(
+		bg: $dark,
+		color: $white,
+		component-header-title: (
 			color: inherit,
+			clay-link: (
+				color: inherit,
+			),
 		),
-	),
-	component-header-subtitle: (
-		color: inherit,
-		clay-link: (
+		component-header-subtitle: (
 			color: inherit,
+			clay-link: (
+				color: inherit,
+			),
+		),
+		close: (
+			color: $secondary-l1,
+			hover-color: $white,
+		),
+		nav-nested-link: (
+			border-radius: $border-radius,
+			color: $secondary-l1,
+			transition: box-shadow 0.15s ease-in-out,
+			hover-color: $white,
+			focus-box-shadow: $component-focus-box-shadow,
+			focus-outline: 0,
+			active-color: $white,
+			disabled-box-shadow: none,
+			disabled-color: $secondary-l1,
+			disabled-opacity: 0.65,
+			disabled-active-pointer-events: none,
 		),
 	),
-	close: (
-		color: $secondary-l1,
-		hover-color: $white,
-	),
-	nav-nested-link: (
-		border-radius: $border-radius,
-		color: $secondary-l1,
-		transition: box-shadow 0.15s ease-in-out,
-		hover-color: $white,
-		focus-box-shadow: $component-focus-box-shadow,
-		focus-outline: 0,
-		active-color: $white,
-		disabled-box-shadow: none,
-		disabled-color: $secondary-l1,
-		disabled-opacity: 0.65,
-		disabled-active-pointer-events: none,
-	),
-), $sidebar-dark);
+	$sidebar-dark
+);
diff --git a/packages/clay-css/src/scss/variables/_slideout.scss b/packages/clay-css/src/scss/variables/_slideout.scss
index 293f72491a..aae6a67630 100644
--- a/packages/clay-css/src/scss/variables/_slideout.scss
+++ b/packages/clay-css/src/scss/variables/_slideout.scss
@@ -9,144 +9,178 @@ $c-slideout-tbar-stacked-min-width-mobile: 40px !default;
 // C Slideout Transitions
 
 $c-slideout-transition-in: () !default;
-$c-slideout-transition-in: map-merge((
-	transition: all 0.3s ease-in-out,
-), $c-slideout-transition-in);
+$c-slideout-transition-in: map-merge(
+	(
+		transition: all 0.3s ease-in-out,
+	),
+	$c-slideout-transition-in
+);
 
 $c-slideout-transition-out: () !default;
-$c-slideout-transition-out: map-merge((
-	transition: all 0.2s ease-in,
-), $c-slideout-transition-out);
+$c-slideout-transition-out: map-merge(
+	(
+		transition: all 0.2s ease-in,
+	),
+	$c-slideout-transition-out
+);
 
 // C Slideout Positions
 
 $c-slideout-absolute: () !default;
-$c-slideout-absolute: map-merge((
-	position: absolute,
-), $c-slideout-absolute);
+$c-slideout-absolute: map-merge(
+	(
+		position: absolute,
+	),
+	$c-slideout-absolute
+);
 
 $c-slideout-fixed: () !default;
-$c-slideout-fixed: map-merge((
-	position: fixed,
-), $c-slideout-fixed);
+$c-slideout-fixed: map-merge(
+	(
+		position: fixed,
+	),
+	$c-slideout-fixed
+);
 
 // C Slideout Base
 
 $c-slideout: () !default;
-$c-slideout: map-deep-merge((
-	display: flex,
-	overflow: hidden,
-	z-index: $zindex-sidenav,
-	c-slideout-shown: (
-		overflow: visible,
-	),
-	sidebar: (
-		display: none,
-		flex-shrink: 0,
-		position: relative,
-		width: $c-slideout-sidebar-width,
-	),
-	sidebar-c-slideout-show: (
-		display: block,
-	),
-	sidebar-c-slideout-transition: (
-		display: block,
-	),
-	tbar-stacked: (
-		display: none,
-		flex-shrink: 0,
-		min-width: $c-slideout-tbar-stacked-min-width,
-		overflow: auto,
-		position: relative,
-		z-index: 1,
-	),
-	tbar-stacked-c-slideout-show: (
-		display: block,
-	),
-	tbar-stacked-c-slideout-transition: (
-		display: block,
-	),
-), $c-slideout);
+$c-slideout: map-deep-merge(
+	(
+		display: flex,
+		overflow: hidden,
+		z-index: $zindex-sidenav,
+		c-slideout-shown: (
+			overflow: visible,
+		),
+		sidebar: (
+			display: none,
+			flex-shrink: 0,
+			position: relative,
+			width: $c-slideout-sidebar-width,
+		),
+		sidebar-c-slideout-show: (
+			display: block,
+		),
+		sidebar-c-slideout-transition: (
+			display: block,
+		),
+		tbar-stacked: (
+			display: none,
+			flex-shrink: 0,
+			min-width: $c-slideout-tbar-stacked-min-width,
+			overflow: auto,
+			position: relative,
+			z-index: 1,
+		),
+		tbar-stacked-c-slideout-show: (
+			display: block,
+		),
+		tbar-stacked-c-slideout-transition: (
+			display: block,
+		),
+	),
+	$c-slideout
+);
 
 $c-slideout-sm-down: () !default;
-$c-slideout-sm-down: map-deep-merge((
-	sidebar: (
-		width: $c-slideout-sidebar-width-mobile,
+$c-slideout-sm-down: map-deep-merge(
+	(
+		sidebar: (
+			width: $c-slideout-sidebar-width-mobile,
+		),
 	),
-), $c-slideout-sm-down);
+	$c-slideout-sm-down
+);
 
 // C Slideout Start
 
 $c-slideout-start: () !default;
-$c-slideout-start: map-deep-merge((
-	bottom: 0,
-	left: 0,
-	top: 0,
-	c-slideout-tbar-shown-sidebar: (
-		left: math-sign($c-slideout-sidebar-width),
-	),
-	sidebar: (
-		left: #{math-sign($c-slideout-sidebar-width) + math-sign($c-slideout-tbar-stacked-min-width)},
-		width: $c-slideout-sidebar-width,
-	),
-	sidebar-c-slideout-show: (
+$c-slideout-start: map-deep-merge(
+	(
+		bottom: 0,
 		left: 0,
-	),
-	tbar-stacked: (
-		left: math-sign($c-slideout-tbar-stacked-min-width),
-	),
-	tbar-stacked-c-slideout-show: (
-		left: 0,
-	),
-), $c-slideout-start);
+		top: 0,
+		c-slideout-tbar-shown-sidebar: (
+			left: math-sign($c-slideout-sidebar-width),
+		),
+		sidebar: (
+			left: #{math-sign($c-slideout-sidebar-width) +
+				math-sign($c-slideout-tbar-stacked-min-width)},
+			width: $c-slideout-sidebar-width,
+		),
+		sidebar-c-slideout-show: (
+			left: 0,
+		),
+		tbar-stacked: (
+			left: math-sign($c-slideout-tbar-stacked-min-width),
+		),
+		tbar-stacked-c-slideout-show: (
+			left: 0,
+		),
+	),
+	$c-slideout-start
+);
 
 $c-slideout-start-sm-down: () !default;
-$c-slideout-start-sm-down: map-deep-merge((
-	c-slideout-tbar-shown-sidebar: (
-		left: math-sign($c-slideout-sidebar-width-mobile),
-	),
-	sidebar: (
-		left: #{math-sign($c-slideout-sidebar-width-mobile) + math-sign($c-slideout-tbar-stacked-min-width-mobile)},
-		width: $c-slideout-sidebar-width-mobile,
-	),
-	tbar-stacked: (
-		left: math-sign($c-slideout-tbar-stacked-min-width-mobile),
-	),
-), $c-slideout-start-sm-down);
+$c-slideout-start-sm-down: map-deep-merge(
+	(
+		c-slideout-tbar-shown-sidebar: (
+			left: math-sign($c-slideout-sidebar-width-mobile),
+		),
+		sidebar: (
+			left: #{math-sign($c-slideout-sidebar-width-mobile) +
+				math-sign($c-slideout-tbar-stacked-min-width-mobile)},
+			width: $c-slideout-sidebar-width-mobile,
+		),
+		tbar-stacked: (
+			left: math-sign($c-slideout-tbar-stacked-min-width-mobile),
+		),
+	),
+	$c-slideout-start-sm-down
+);
 
 // C Slideout End
 
 $c-slideout-end: () !default;
-$c-slideout-end: map-deep-merge((
-	bottom: 0,
-	right: 0,
-	top: 0,
-	c-slideout-tbar-shown-sidebar: (
-		right: math-sign($c-slideout-sidebar-width),
-	),
-	sidebar: (
-		right: #{math-sign($c-slideout-sidebar-width) + math-sign($c-slideout-tbar-stacked-min-width)},
-	),
-	sidebar-c-slideout-show: (
+$c-slideout-end: map-deep-merge(
+	(
+		bottom: 0,
 		right: 0,
-	),
-	tbar-stacked: (
-		right: math-sign($c-slideout-tbar-stacked-min-width),
-	),
-	tbar-stacked-c-slideout-show: (
-		right: 0,
-	),
-), $c-slideout-end);
+		top: 0,
+		c-slideout-tbar-shown-sidebar: (
+			right: math-sign($c-slideout-sidebar-width),
+		),
+		sidebar: (
+			right: #{math-sign($c-slideout-sidebar-width) +
+				math-sign($c-slideout-tbar-stacked-min-width)},
+		),
+		sidebar-c-slideout-show: (
+			right: 0,
+		),
+		tbar-stacked: (
+			right: math-sign($c-slideout-tbar-stacked-min-width),
+		),
+		tbar-stacked-c-slideout-show: (
+			right: 0,
+		),
+	),
+	$c-slideout-end
+);
 
 $c-slideout-end-sm-down: () !default;
-$c-slideout-end-sm-down: map-deep-merge((
-	c-slideout-tbar-shown-sidebar: (
-		right: math-sign($c-slideout-sidebar-width-mobile),
-	),
-	sidebar: (
-		right: #{math-sign($c-slideout-sidebar-width-mobile) + math-sign($c-slideout-tbar-stacked-min-width-mobile)},
-	),
-	tbar-stacked: (
-		right: math-sign($c-slideout-tbar-stacked-min-width-mobile),
-	),
-), $c-slideout-end-sm-down);
+$c-slideout-end-sm-down: map-deep-merge(
+	(
+		c-slideout-tbar-shown-sidebar: (
+			right: math-sign($c-slideout-sidebar-width-mobile),
+		),
+		sidebar: (
+			right: #{math-sign($c-slideout-sidebar-width-mobile) +
+				math-sign($c-slideout-tbar-stacked-min-width-mobile)},
+		),
+		tbar-stacked: (
+			right: math-sign($c-slideout-tbar-stacked-min-width-mobile),
+		),
+	),
+	$c-slideout-end-sm-down
+);
diff --git a/packages/clay-css/src/scss/variables/_stickers.scss b/packages/clay-css/src/scss/variables/_stickers.scss
index f4dfd33ded..77ed617b70 100644
--- a/packages/clay-css/src/scss/variables/_stickers.scss
+++ b/packages/clay-css/src/scss/variables/_stickers.scss
@@ -12,22 +12,31 @@ $sticker-inline-item-font-size: null !default;
 // Sticker Sizes
 
 $sticker-sm: () !default;
-$sticker-sm: map-deep-merge((
-	font-size: 0.75rem,
-	size: 1.5rem
-), $sticker-sm);
+$sticker-sm: map-deep-merge(
+	(
+		font-size: 0.75rem,
+		size: 1.5rem,
+	),
+	$sticker-sm
+);
 
 $sticker-lg: () !default;
-$sticker-lg: map-deep-merge((
-	font-size: 1.125rem,
-	size: 2.5rem
-), $sticker-lg);
+$sticker-lg: map-deep-merge(
+	(
+		font-size: 1.125rem,
+		size: 2.5rem,
+	),
+	$sticker-lg
+);
 
 $sticker-xl: () !default;
-$sticker-xl: map-deep-merge((
-	font-size: 1.25rem,
-	size: 3rem
-), $sticker-xl);
+$sticker-xl: map-deep-merge(
+	(
+		font-size: 1.25rem,
+		size: 3rem,
+	),
+	$sticker-xl
+);
 
 // Sticker Positions
 
@@ -41,11 +50,14 @@ $sticker-circle-border-radius: $rounded-circle-border-radius !default;
 // Sticker User Icon
 
 $sticker-user-icon: () !default;
-$sticker-user-icon: map-deep-merge((
-	bg: $white,
-	border-radius: $rounded-circle-border-radius,
-	box-shadow: 0 0 0 1px rgba($black, 0.125),
-), $sticker-user-icon);
+$sticker-user-icon: map-deep-merge(
+	(
+		bg: $white,
+		border-radius: $rounded-circle-border-radius,
+		box-shadow: 0 0 0 1px rgba($black, 0.125),
+	),
+	$sticker-user-icon
+);
 
 // Sticker Variants
 
@@ -82,45 +94,48 @@ $sticker-dark-border-color: null !default;
 $sticker-dark-color: color-yiq($sticker-dark-bg) !default;
 
 $sticker-palette: () !default;
-$sticker-palette: map-deep-merge((
-	primary: (
-		bg: $sticker-primary-bg,
-		border-color: $sticker-primary-border-color,
-		color: $sticker-primary-color
-	),
-	secondary: (
-		bg: $sticker-secondary-bg,
-		border-color: $sticker-secondary-border-color,
-		color: $sticker-secondary-color
-	),
-	success: (
-		bg: $sticker-success-bg,
-		border-color: $sticker-success-border-color,
-		color: $sticker-success-color
-	),
-	info: (
-		bg: $sticker-info-bg,
-		border-color: $sticker-info-border-color,
-		color: $sticker-info-color
-	),
-	warning: (
-		bg: $sticker-warning-bg,
-		border-color: $sticker-warning-border-color,
-		color: $sticker-warning-color
-	),
-	danger: (
-		bg: $sticker-danger-bg,
-		border-color: $sticker-danger-border-color,
-		color: $sticker-danger-color
-	),
-	light: (
-		bg: $sticker-light-bg,
-		border-color: $sticker-light-border-color,
-		color: $sticker-light-color
+$sticker-palette: map-deep-merge(
+	(
+		primary: (
+			bg: $sticker-primary-bg,
+			border-color: $sticker-primary-border-color,
+			color: $sticker-primary-color,
+		),
+		secondary: (
+			bg: $sticker-secondary-bg,
+			border-color: $sticker-secondary-border-color,
+			color: $sticker-secondary-color,
+		),
+		success: (
+			bg: $sticker-success-bg,
+			border-color: $sticker-success-border-color,
+			color: $sticker-success-color,
+		),
+		info: (
+			bg: $sticker-info-bg,
+			border-color: $sticker-info-border-color,
+			color: $sticker-info-color,
+		),
+		warning: (
+			bg: $sticker-warning-bg,
+			border-color: $sticker-warning-border-color,
+			color: $sticker-warning-color,
+		),
+		danger: (
+			bg: $sticker-danger-bg,
+			border-color: $sticker-danger-border-color,
+			color: $sticker-danger-color,
+		),
+		light: (
+			bg: $sticker-light-bg,
+			border-color: $sticker-light-border-color,
+			color: $sticker-light-color,
+		),
+		dark: (
+			bg: $sticker-dark-bg,
+			border-color: $sticker-dark-border-color,
+			color: $sticker-dark-color,
+		),
 	),
-	dark: (
-		bg: $sticker-dark-bg,
-		border-color: $sticker-dark-border-color,
-		color: $sticker-dark-color
-	)
-), $sticker-palette);
\ No newline at end of file
+	$sticker-palette
+);
diff --git a/packages/clay-css/src/scss/variables/_tables.scss b/packages/clay-css/src/scss/variables/_tables.scss
index 913d62f7b4..c3a29edd79 100644
--- a/packages/clay-css/src/scss/variables/_tables.scss
+++ b/packages/clay-css/src/scss/variables/_tables.scss
@@ -8,7 +8,7 @@ $table-margin-bottom: 0 !default;
 $table-cell-gutters: $grid-gutter-width / 2 !default; // 15px
 
 $table-disabled-bg: $white !default;
-$table-disabled-color: #ACACAC !default;
+$table-disabled-color: #acacac !default;
 $table-disabled-cursor: $disabled-cursor !default;
 $table-disabled-pointer-events: none !default;
 
@@ -21,7 +21,9 @@ $table-head-height: 36px !default;
 $table-head-link: () !default;
 
 $table-head-title-inline-item-spacer-x: 0.25rem !default; // 4px
-$table-head-title-text-truncate-max-width: calc(100% - 1em - #{$table-head-title-inline-item-spacer-x}) !default;
+$table-head-title-text-truncate-max-width: calc(
+	100% - 1em - #{$table-head-title-inline-item-spacer-x}
+) !default;
 
 $table-data-border-bottom-width: $table-border-width !default;
 $table-data-border-left-width: 0 !default;
@@ -40,7 +42,11 @@ $table-divider-padding: $table-cell-padding !default;
 $table-divider-text-transform: null !default;
 
 $table-quick-action-menu-align-items: flex-start !default;
-$table-quick-action-menu-bg: if($table-bg == transparent, $body-bg, $table-bg) !default;
+$table-quick-action-menu-bg: if(
+	$table-bg == transparent,
+	$body-bg,
+	$table-bg
+) !default;
 $table-quick-action-menu-accent-bg: $table-accent-bg !default;
 $table-quick-action-menu-accent-active-bg: $table-accent-bg !default;
 $table-quick-action-menu-active-bg: $table-active-bg !default;
@@ -64,41 +70,53 @@ $table-bordered-border-width: $table-border-width !default;
 // Table Title
 
 $table-title: () !default;
-$table-title: map-deep-merge((
-	font-size: $font-size-base,
-	font-weight: $font-weight-semi-bold,
-	line-height: $line-height-base,
-	margin-bottom: 0
-), $table-title);
+$table-title: map-deep-merge(
+	(
+		font-size: $font-size-base,
+		font-weight: $font-weight-semi-bold,
+		line-height: $line-height-base,
+		margin-bottom: 0,
+	),
+	$table-title
+);
 
 $table-title-link: () !default;
-$table-title-link: map-deep-merge((
-	color: $gray-900,
-	hover-color: $gray-900,
-), $table-title-link);
+$table-title-link: map-deep-merge(
+	(
+		color: $gray-900,
+		hover-color: $gray-900,
+	),
+	$table-title-link
+);
 
 // Table Link
 
 $table-link: () !default;
-$table-link: map-deep-merge((
-	color: $gray-700,
-	hover-color: darken($gray-700, 15%)
-), $table-link);
+$table-link: map-deep-merge(
+	(
+		color: $gray-700,
+		hover-color: darken($gray-700, 15%),
+	),
+	$table-link
+);
 
 // Table Action Link
 
 $table-action-link: () !default;
-$table-action-link: map-deep-merge((
-	align-items: center,
-	border-radius: $btn-border-radius,
-	display: inline-flex,
-	height: 2rem,
-	justify-content: center,
-	vertical-align: middle,
-	width: 2rem,
-	hover-text-decoration: none,
-	lexicon-icon-margin-top: 0
-), $table-action-link);
+$table-action-link: map-deep-merge(
+	(
+		align-items: center,
+		border-radius: $btn-border-radius,
+		display: inline-flex,
+		height: 2rem,
+		justify-content: center,
+		vertical-align: middle,
+		width: 2rem,
+		hover-text-decoration: none,
+		lexicon-icon-margin-top: 0,
+	),
+	$table-action-link
+);
 
 // Table Img
 
@@ -108,12 +126,12 @@ $table-img-max-height: 100px !default;
 
 $table-list-bg: $white !default;
 $table-list-color: null !default;
-$table-list-accent-bg: #F2F2F2 !default;
-$table-list-hover-bg: #ECECEC !default;
-$table-list-active-bg: #DADADA !default;
+$table-list-accent-bg: #f2f2f2 !default;
+$table-list-hover-bg: #ececec !default;
+$table-list-active-bg: #dadada !default;
 
 $table-list-disabled-bg: $white !default;
-$table-list-disabled-color: #ACACAC !default;
+$table-list-disabled-color: #acacac !default;
 $table-list-disabled-cursor: $disabled-cursor !default;
 $table-list-disabled-pointer-events: none !default;
 
@@ -150,43 +168,55 @@ $table-list-quick-action-menu-hover-bg: $table-list-hover-bg !default;
 // Table List Title
 
 $table-list-title: () !default;
-$table-list-title: map-deep-merge((
-	font-size: $font-size-base,
-	font-weight: $font-weight-semi-bold,
-	line-height: $headings-line-height,
-	margin-bottom: 0
-), $table-list-title);
+$table-list-title: map-deep-merge(
+	(
+		font-size: $font-size-base,
+		font-weight: $font-weight-semi-bold,
+		line-height: $headings-line-height,
+		margin-bottom: 0,
+	),
+	$table-list-title
+);
 
 $table-list-title-link: () !default;
-$table-list-title-link: map-deep-merge((
-	color: $gray-900,
-	hover-color: $gray-900,
-), $table-list-title-link);
+$table-list-title-link: map-deep-merge(
+	(
+		color: $gray-900,
+		hover-color: $gray-900,
+	),
+	$table-list-title-link
+);
 
 // Table List Link
 
 $table-list-link: () !default;
-$table-list-link: map-deep-merge((
-	color: $gray-700,
-	hover-color: darken($gray-700, 15%)
-), $table-list-link);
+$table-list-link: map-deep-merge(
+	(
+		color: $gray-700,
+		hover-color: darken($gray-700, 15%),
+	),
+	$table-list-link
+);
 
 // Table List Action Link
 
 $table-list-action-link: () !default;
-$table-list-action-link: map-deep-merge((
-	align-items: center,
-	display: inline-flex,
-	height: 2rem,
-	justify-content: center,
-	vertical-align: middle,
-	width: 2rem,
-	hover-text-decoration: none,
-	lexicon-icon-margin-top: 0
-), $table-list-action-link);
+$table-list-action-link: map-deep-merge(
+	(
+		align-items: center,
+		display: inline-flex,
+		height: 2rem,
+		justify-content: center,
+		vertical-align: middle,
+		width: 2rem,
+		hover-text-decoration: none,
+		lexicon-icon-margin-top: 0,
+	),
+	$table-list-action-link
+);
 
 // Table Valign
 
 $table-valign-top-body-cell-padding-top: 1rem !default;
 
-$table-valign-bottom-body-cell-padding-bottom: 1rem !default;
\ No newline at end of file
+$table-valign-bottom-body-cell-padding-bottom: 1rem !default;
diff --git a/packages/clay-css/src/scss/variables/_tbar.scss b/packages/clay-css/src/scss/variables/_tbar.scss
index 374b3f1fb8..93764b8049 100644
--- a/packages/clay-css/src/scss/variables/_tbar.scss
+++ b/packages/clay-css/src/scss/variables/_tbar.scss
@@ -4,325 +4,395 @@ $tbar-item-padding-y: null !default;
 // Tbar Stacked
 
 $tbar-stacked: () !default;
-$tbar-stacked: map-deep-merge((
-	display: inline-flex,
-	height: 100%,
-	padding-bottom: 0.5rem,
-	padding-top: 0.5rem,
-	nav: (
-		flex-direction: column,
-		min-width: 0,
-	),
-	item: (
-		align-items: center,
-		justify-content: flex-start,
-		padding-left: 0,
-		padding-right: 0,
-	),
-	item-expand: (
-		flex-shrink: 0,
-		min-width: 0,
-	),
-	divider-before: (
-		background-color: $body-color,
-		content: '',
-		display: block,
-		height: 1px,
-		margin-bottom: 0.25rem,
-		margin-top: 0.25rem,
-		width: 2.5rem,
-	),
-	divider-after: (
-		background-color: $body-color,
-		content: '',
-		display: block,
-		height: 1px,
-		margin-bottom: 0.25rem,
-		margin-top: 0.25rem,
-		width: 2.5rem,
-	),
-	btn-monospaced: (
-		border-color: transparent,
-		border-radius: 0,
-		border-width: 0,
-		color: inherit,
-		height: 2.5rem,
-		margin-bottom: 0,
-		margin-top: 0,
-		overflow: visible,
-		padding-bottom: 0,
-		padding-left: 0,
-		padding-right: 0,
-		padding-top: 0,
-		position: relative,
-		width: 2.5rem,
-		focus: (
-			box-shadow: inset 0 0 0 0.125rem $primary-l1#{','} inset 0 0 0 0.25rem $white,
+$tbar-stacked: map-deep-merge(
+	(
+		display: inline-flex,
+		height: 100%,
+		padding-bottom: 0.5rem,
+		padding-top: 0.5rem,
+		nav: (
+			flex-direction: column,
+			min-width: 0,
+		),
+		item: (
+			align-items: center,
+			justify-content: flex-start,
+			padding-left: 0,
+			padding-right: 0,
+		),
+		item-expand: (
+			flex-shrink: 0,
+			min-width: 0,
+		),
+		divider-before: (
+			background-color: $body-color,
+			content: '',
+			display: block,
+			height: 1px,
+			margin-bottom: 0.25rem,
+			margin-top: 0.25rem,
+			width: 2.5rem,
 		),
-		active-focus: (
-			box-shadow: inset 0 0 0 0.125rem $primary-l1#{','} inset 0 0 0 0.25rem $white,
+		divider-after: (
+			background-color: $body-color,
+			content: '',
+			display: block,
+			height: 1px,
+			margin-bottom: 0.25rem,
+			margin-top: 0.25rem,
+			width: 2.5rem,
+		),
+		btn-monospaced: (
+			border-color: transparent,
+			border-radius: 0,
+			border-width: 0,
+			color: inherit,
+			height: 2.5rem,
+			margin-bottom: 0,
+			margin-top: 0,
+			overflow: visible,
+			padding-bottom: 0,
+			padding-left: 0,
+			padding-right: 0,
+			padding-top: 0,
+			position: relative,
+			width: 2.5rem,
+			focus: (
+				box-shadow: inset 0 0 0 0.125rem $primary-l1#{','} inset 0 0 0 0.25rem
+					$white,
+			),
+			active-focus: (
+				box-shadow: inset 0 0 0 0.125rem $primary-l1#{','} inset 0 0 0 0.25rem
+					$white,
+			),
 		),
 	),
-), $tbar-stacked);
+	$tbar-stacked
+);
 
 // Tbar Inline {xs|sm|md|lg|xl} Down
 
 $tbar-inline-xs-down: () !default;
-$tbar-inline-xs-down: map-deep-merge((
-	breakpoint-down: nth(map-keys($grid-breakpoints), 1),
-	item-padding-left: 0
-), $tbar-inline-xs-down);
+$tbar-inline-xs-down: map-deep-merge(
+	(
+		breakpoint-down: nth(map-keys($grid-breakpoints), 1),
+		item-padding-left: 0,
+	),
+	$tbar-inline-xs-down
+);
 
 $tbar-inline-sm-down: () !default;
-$tbar-inline-sm-down: map-deep-merge((
-	breakpoint-down: nth(map-keys($grid-breakpoints), 2),
-	item-padding-left: 0
-), $tbar-inline-sm-down);
+$tbar-inline-sm-down: map-deep-merge(
+	(
+		breakpoint-down: nth(map-keys($grid-breakpoints), 2),
+		item-padding-left: 0,
+	),
+	$tbar-inline-sm-down
+);
 
 $tbar-inline-md-down: () !default;
-$tbar-inline-md-down: map-deep-merge((
-	breakpoint-down: nth(map-keys($grid-breakpoints), 3),
-	item-padding-left: 0
-), $tbar-inline-md-down);
+$tbar-inline-md-down: map-deep-merge(
+	(
+		breakpoint-down: nth(map-keys($grid-breakpoints), 3),
+		item-padding-left: 0,
+	),
+	$tbar-inline-md-down
+);
 
 $tbar-inline-lg-down: () !default;
-$tbar-inline-lg-down: map-deep-merge((
-	breakpoint-down: nth(map-keys($grid-breakpoints), 4),
-	item-padding-left: 0
-), $tbar-inline-lg-down);
+$tbar-inline-lg-down: map-deep-merge(
+	(
+		breakpoint-down: nth(map-keys($grid-breakpoints), 4),
+		item-padding-left: 0,
+	),
+	$tbar-inline-lg-down
+);
 
 $tbar-inline-xl-down: () !default;
-$tbar-inline-xl-down: map-deep-merge((
-	breakpoint-down: nth(map-keys($grid-breakpoints), 5),
-	item-padding-left: 0
-), $tbar-inline-xl-down);
+$tbar-inline-xl-down: map-deep-merge(
+	(
+		breakpoint-down: nth(map-keys($grid-breakpoints), 5),
+		item-padding-left: 0,
+	),
+	$tbar-inline-xl-down
+);
 
 // Component Tbar
 
 $component-tbar: () !default;
-$component-tbar: map-deep-merge((
-	border-color: $gray-300,
-	border-style: solid,
-	border-width: 0 0 0.0625rem 0,
-	height: 3.5rem
-), $component-tbar);
+$component-tbar: map-deep-merge(
+	(
+		border-color: $gray-300,
+		border-style: solid,
+		border-width: 0 0 0.0625rem 0,
+		height: 3.5rem,
+	),
+	$component-tbar
+);
 
 // Tbar Variants
 
 $tbar-light: () !default;
-$tbar-light: map-deep-merge((
-	background-color: $white,
-	box-shadow: inset 1px 0 0 0 $gray-200#{','} inset -1px 0 0 0 $gray-200,
-	color: $secondary,
-	divider-before: (
-		background-color: $gray-200,
-	),
-	divider-after: (
-		background-color: $gray-200,
-	),
-	btn-monospaced: (
-		hover: (
-			color: $dark,
-		),
-		focus: (
-			color: $dark,
-		),
-		disabled: (
-			color: inherit,
+$tbar-light: map-deep-merge(
+	(
+		background-color: $white,
+		box-shadow: inset 1px 0 0 0 $gray-200#{','} inset -1px 0 0 0 $gray-200,
+		color: $secondary,
+		divider-before: (
+			background-color: $gray-200,
 		),
-		active: (
+		divider-after: (
 			background-color: $gray-200,
-			color: $dark,
+		),
+		btn-monospaced: (
+			hover: (
+				color: $dark,
+			),
+			focus: (
+				color: $dark,
+			),
+			disabled: (
+				color: inherit,
+			),
+			active: (
+				background-color: $gray-200,
+				color: $dark,
+			),
 		),
 	),
-), $tbar-light);
+	$tbar-light
+);
 
 $tbar-dark-d1: () !default;
-$tbar-dark-d1: map-deep-merge((
-	background-color: $dark-d1,
-	box-shadow: inset 1px 0 0 0 rgba($white, 0.06)#{','} inset -1px 0 0 0 rgba($white, 0.06),
-	color: $gray-500,
-	divider-before: (
-		background-color: rgba($white, 0.06),
-	),
-	divider-after: (
-		background-color: rgba($white, 0.06),
-	),
-	btn-monospaced: (
-		hover: (
-			color: $white,
-		),
-		focus: (
-			color: $white,
-		),
-		disabled: (
-			color: inherit,
+$tbar-dark-d1: map-deep-merge(
+	(
+		background-color: $dark-d1,
+		box-shadow: inset 1px 0 0 0 rgba($white, 0.06) #{','} inset -1px 0 0 0
+			rgba($white, 0.06),
+		color: $gray-500,
+		divider-before: (
+			background-color: rgba($white, 0.06),
 		),
-		active: (
+		divider-after: (
 			background-color: rgba($white, 0.06),
-			color: $white,
 		),
-		active-class-after: (
-			background-color: $primary-l1,
-			bottom: 0,
-			content: '',
-			display: block,
-			left: 0,
-			position: absolute,
-			top: 0,
-			width: 0.25rem,
+		btn-monospaced: (
+			hover: (
+				color: $white,
+			),
+			focus: (
+				color: $white,
+			),
+			disabled: (
+				color: inherit,
+			),
+			active: (
+				background-color: rgba($white, 0.06),
+				color: $white,
+			),
+			active-class-after: (
+				background-color: $primary-l1,
+				bottom: 0,
+				content: '',
+				display: block,
+				left: 0,
+				position: absolute,
+				top: 0,
+				width: 0.25rem,
+			),
 		),
 	),
-), $tbar-dark-d1);
+	$tbar-dark-d1
+);
 
 $tbar-dark-l2: () !default;
-$tbar-dark-l2: map-deep-merge((
-	background-color: $dark-l2,
-	box-shadow: inset 1px 0 0 0 rgba($white, 0.06)#{','} inset -1px 0 0 0 rgba($white, 0.06),
-	border-color: rgba($white, 0.06),
-	color: $gray-500,
-	divider-before: (
-		background-color: rgba($white, 0.06),
-	),
-	divider-after: (
-		background-color: rgba($white, 0.06),
-	),
-	btn-monospaced: (
-		hover: (
-			color: $white,
-		),
-		focus: (
-			color: $white,
-		),
-		disabled: (
-			color: inherit,
+$tbar-dark-l2: map-deep-merge(
+	(
+		background-color: $dark-l2,
+		box-shadow: inset 1px 0 0 0 rgba($white, 0.06) #{','} inset -1px 0 0 0
+			rgba($white, 0.06),
+		border-color: rgba($white, 0.06),
+		color: $gray-500,
+		divider-before: (
+			background-color: rgba($white, 0.06),
 		),
-		active: (
+		divider-after: (
 			background-color: rgba($white, 0.06),
-			color: $white,
+		),
+		btn-monospaced: (
+			hover: (
+				color: $white,
+			),
+			focus: (
+				color: $white,
+			),
+			disabled: (
+				color: inherit,
+			),
+			active: (
+				background-color: rgba($white, 0.06),
+				color: $white,
+			),
 		),
 	),
-), $tbar-dark-l2);
+	$tbar-dark-l2
+);
 
 // Subnav Tbar
 
 $subnav-tbar-component-title: () !default;
-$subnav-tbar-component-title: map-deep-merge((
-	display: inline-block,
-	font-size: 0.875rem,
-	font-weight: $font-weight-semi-bold,
-	line-height: 1.45,
-	margin-bottom: 0.25rem,
-	margin-top: 0.25rem,
-	max-width: 100%
-), $subnav-tbar-component-title);
+$subnav-tbar-component-title: map-deep-merge(
+	(
+		display: inline-block,
+		font-size: 0.875rem,
+		font-weight: $font-weight-semi-bold,
+		line-height: 1.45,
+		margin-bottom: 0.25rem,
+		margin-top: 0.25rem,
+		max-width: 100%,
+	),
+	$subnav-tbar-component-title
+);
 
 $subnav-tbar-component-link: () !default;
-$subnav-tbar-component-link: map-deep-merge((
-	color: $link-color,
-	hover-color: $link-hover-color,
-	font-weight: $font-weight-semi-bold
-), $subnav-tbar-component-link);
+$subnav-tbar-component-link: map-deep-merge(
+	(
+		color: $link-color,
+		hover-color: $link-hover-color,
+		font-weight: $font-weight-semi-bold,
+	),
+	$subnav-tbar-component-link
+);
 
 $subnav-tbar-component-text: () !default;
-$subnav-tbar-component-text: map-deep-merge((
-	display: inline-block,
-	line-height: 1.45,
-	margin-bottom: 0.25rem,
-	margin-top: 0.25rem,
-	max-width: 100%
-), $subnav-tbar-component-text);
+$subnav-tbar-component-text: map-deep-merge(
+	(
+		display: inline-block,
+		line-height: 1.45,
+		margin-bottom: 0.25rem,
+		margin-top: 0.25rem,
+		max-width: 100%,
+	),
+	$subnav-tbar-component-text
+);
 
 $subnav-tbar: () !default;
-$subnav-tbar: map-deep-merge((
-	font-size: 0.875rem,
-	section-text-align: left,
-	strong-font-weight: $font-weight-semi-bold,
-	item-padding-x: 0.5rem,
-	btn-height: 1.5rem,
-	btn-line-height: 1,
-	btn-margin-y: 0.125rem,
-	btn-padding-y: 0,
-	btn-monospaced-margin-y: 0.125rem,
-	btn-monospaced-padding: 0.25rem,
-	component-link: $subnav-tbar-component-link,
-	component-title: $subnav-tbar-component-title,
-	component-text: $subnav-tbar-component-text,
-	link-margin-y: 0.125rem,
-	link-padding-x: 0.25rem,
-	link-padding-y: 0.09375rem,
-	link-monospaced-margin-y: 0.125rem,
-	link-monospaced-size: 1.5rem
-), $subnav-tbar);
+$subnav-tbar: map-deep-merge(
+	(
+		font-size: 0.875rem,
+		section-text-align: left,
+		strong-font-weight: $font-weight-semi-bold,
+		item-padding-x: 0.5rem,
+		btn-height: 1.5rem,
+		btn-line-height: 1,
+		btn-margin-y: 0.125rem,
+		btn-padding-y: 0,
+		btn-monospaced-margin-y: 0.125rem,
+		btn-monospaced-padding: 0.25rem,
+		component-link: $subnav-tbar-component-link,
+		component-title: $subnav-tbar-component-title,
+		component-text: $subnav-tbar-component-text,
+		link-margin-y: 0.125rem,
+		link-padding-x: 0.25rem,
+		link-padding-y: 0.09375rem,
+		link-monospaced-margin-y: 0.125rem,
+		link-monospaced-size: 1.5rem,
+	),
+	$subnav-tbar
+);
 
 // Subnav Tbar Variants
 
 $subnav-tbar-light: () !default;
-$subnav-tbar-light: map-deep-merge((
-	bg-color: $light,
-	color: $navbar-light-color,
-	padding-y: 0.125rem
-), $subnav-tbar-light);
+$subnav-tbar-light: map-deep-merge(
+	(
+		bg-color: $light,
+		color: $navbar-light-color,
+		padding-y: 0.125rem,
+	),
+	$subnav-tbar-light
+);
 
 // Subnav Tbar Primary
 
 $subnav-tbar-primary-component-link: () !default;
-$subnav-tbar-primary-component-link: map-deep-merge((
-	color: $gray-900,
-	hover-color: $gray-900,
-	disabled-color: $gray-600,
-	disabled-cursor: $disabled-cursor,
-	disabled-opacity: $btn-disabled-opacity,
-	disabled-text-decoration: none
-), $subnav-tbar-primary-component-link);
+$subnav-tbar-primary-component-link: map-deep-merge(
+	(
+		color: $gray-900,
+		hover-color: $gray-900,
+		disabled-color: $gray-600,
+		disabled-cursor: $disabled-cursor,
+		disabled-opacity: $btn-disabled-opacity,
+		disabled-text-decoration: none,
+	),
+	$subnav-tbar-primary-component-link
+);
 
 $subnav-tbar-primary-component-label-close: () !default;
-$subnav-tbar-primary-component-label-close: map-deep-merge((
-	focus-color: inherit,
-	disabled-color: $gray-600,
-	disabled-opacity: $btn-disabled-opacity
-), $subnav-tbar-primary-component-label-close);
+$subnav-tbar-primary-component-label-close: map-deep-merge(
+	(
+		focus-color: inherit,
+		disabled-color: $gray-600,
+		disabled-opacity: $btn-disabled-opacity,
+	),
+	$subnav-tbar-primary-component-label-close
+);
 
 $subnav-tbar-primary-component-label: () !default;
-$subnav-tbar-primary-component-label: map-deep-merge((
-	close: $subnav-tbar-primary-component-label-close
-), $subnav-tbar-primary-component-label);
+$subnav-tbar-primary-component-label: map-deep-merge(
+	(
+		close: $subnav-tbar-primary-component-label-close,
+	),
+	$subnav-tbar-primary-component-label
+);
 
 $subnav-tbar-primary-tbar-label-size: () !default;
-$subnav-tbar-primary-tbar-label-size: map-deep-merge((
-	font-size: 0.75rem,
-	margin-right: 0,
-	padding-x: 0.625rem,
-	padding-y: 0.3125rem,
-	text-transform: none
-), $subnav-tbar-primary-tbar-label-size);
+$subnav-tbar-primary-tbar-label-size: map-deep-merge(
+	(
+		font-size: 0.75rem,
+		margin-right: 0,
+		padding-x: 0.625rem,
+		padding-y: 0.3125rem,
+		text-transform: none,
+	),
+	$subnav-tbar-primary-tbar-label-size
+);
 
 $subnav-tbar-primary: () !default;
-$subnav-tbar-primary: map-deep-merge((
-	bg-color: $primary-l2,
-	padding-x: 0.25rem,
-	padding-y: 0.625rem,
-	item-justify-content: flex-start,
-	item-padding-x: 0.25rem,
-	link-monospaced-border-radius: 0,
-	link-monospaced-border-width: 0,
-	link-monospaced-margin-y: -0.625rem,
-	link-monospaced-size: 3rem,
-	component-link: $subnav-tbar-primary-component-link,
-	component-label: $subnav-tbar-primary-component-label,
-	tbar-label-size: $subnav-tbar-primary-tbar-label-size
-), $subnav-tbar-primary);
+$subnav-tbar-primary: map-deep-merge(
+	(
+		bg-color: $primary-l2,
+		padding-x: 0.25rem,
+		padding-y: 0.625rem,
+		item-justify-content: flex-start,
+		item-padding-x: 0.25rem,
+		link-monospaced-border-radius: 0,
+		link-monospaced-border-width: 0,
+		link-monospaced-margin-y: -0.625rem,
+		link-monospaced-size: 3rem,
+		component-link: $subnav-tbar-primary-component-link,
+		component-label: $subnav-tbar-primary-component-label,
+		tbar-label-size: $subnav-tbar-primary-tbar-label-size,
+	),
+	$subnav-tbar-primary
+);
 
 // Subnav Tbar Primary Disabled
 
 $subnav-tbar-primary-disabled-component-label: () !default;
-$subnav-tbar-primary-disabled-component-label: map-deep-merge((
-	border-color: #6C757D
-), $subnav-tbar-primary-disabled-component-label);
+$subnav-tbar-primary-disabled-component-label: map-deep-merge(
+	(
+		border-color: #6c757d,
+	),
+	$subnav-tbar-primary-disabled-component-label
+);
 
 $subnav-tbar-primary-disabled: () !default;
-$subnav-tbar-primary-disabled: map-deep-merge((
-	bg-color: lighten(desaturate($primary, 27.03), 37.06),
-	color: #6C757D,
-	component-label: $subnav-tbar-primary-disabled-component-label
-), $subnav-tbar-primary-disabled);
+$subnav-tbar-primary-disabled: map-deep-merge(
+	(
+		bg-color: lighten(desaturate($primary, 27.03), 37.06),
+		color: #6c757d,
+		component-label: $subnav-tbar-primary-disabled-component-label,
+	),
+	$subnav-tbar-primary-disabled
+);
diff --git a/packages/clay-css/src/scss/variables/_time.scss b/packages/clay-css/src/scss/variables/_time.scss
index 76e24bc44c..15a0232829 100644
--- a/packages/clay-css/src/scss/variables/_time.scss
+++ b/packages/clay-css/src/scss/variables/_time.scss
@@ -1,84 +1,108 @@
 $clay-time-btn: () !default;
-$clay-time-btn: map-deep-merge((
-	align-items: center,
-	display: inline-flex,
-	font-size: 0.75rem,
-	height: 1.5rem,
-	justify-content: center,
-	padding-bottom: 0,
-	padding-left: 0,
-	padding-right: 0,
-	padding-top: 0,
-	width: 1.5rem,
-), $clay-time-btn);
+$clay-time-btn: map-deep-merge(
+	(
+		align-items: center,
+		display: inline-flex,
+		font-size: 0.75rem,
+		height: 1.5rem,
+		justify-content: center,
+		padding-bottom: 0,
+		padding-left: 0,
+		padding-right: 0,
+		padding-top: 0,
+		width: 1.5rem,
+	),
+	$clay-time-btn
+);
 
 $clay-time-form-control: () !default;
-$clay-time-form-control: map-deep-merge((
-	align-items: center,
-	display: inline-flex,
-	flex-wrap: wrap,
-	padding-bottom: 0.125rem,
-	padding-top: 0.125rem,
-), $clay-time-form-control);
+$clay-time-form-control: map-deep-merge(
+	(
+		align-items: center,
+		display: inline-flex,
+		flex-wrap: wrap,
+		padding-bottom: 0.125rem,
+		padding-top: 0.125rem,
+	),
+	$clay-time-form-control
+);
 
 $clay-time-form-control-inset: () !default;
-$clay-time-form-control-inset: map-deep-merge((
-	margin-bottom: 0,
-	margin-top: 0,
-	text-align: center,
-	width: 1.25rem,
-	selection-bg: transparent,
-	focus-bg: #B3D8FD,
-), $clay-time-form-control-inset);
+$clay-time-form-control-inset: map-deep-merge(
+	(
+		margin-bottom: 0,
+		margin-top: 0,
+		text-align: center,
+		width: 1.25rem,
+		selection-bg: transparent,
+		focus-bg: #b3d8fd,
+	),
+	$clay-time-form-control-inset
+);
 
 $clay-time-ampm: () !default;
-$clay-time-ampm: map-deep-merge((
-	font-weight: 500,
-	margin-left: 0.25rem,
-	text-transform: uppercase,
-	width: 1.5rem,
-), $clay-time-ampm);
+$clay-time-ampm: map-deep-merge(
+	(
+		font-weight: 500,
+		margin-left: 0.25rem,
+		text-transform: uppercase,
+		width: 1.5rem,
+	),
+	$clay-time-ampm
+);
 
 $clay-time-input-group-text: () !default;
-$clay-time-input-group-text: map-deep-merge((
-	bg: transparent,
-	border-color: transparent,
-	padding-bottom: 0,
-	padding-left: 0,
-	padding-right: 0,
-	padding-top: 0,
-), $clay-time-input-group-text);
+$clay-time-input-group-text: map-deep-merge(
+	(
+		bg: transparent,
+		border-color: transparent,
+		padding-bottom: 0,
+		padding-left: 0,
+		padding-right: 0,
+		padding-top: 0,
+	),
+	$clay-time-input-group-text
+);
 
 $clay-time-divider-margin-left: -3px !default;
 $clay-time-divider-margin-right: -3px !default;
 
 $clay-time-edit: () !default;
-$clay-time-edit: map-deep-merge((
-	margin-right: auto,
-	padding-left: 0.5rem,
-	padding-right: 0.5rem,
-), $clay-time-edit);
+$clay-time-edit: map-deep-merge(
+	(
+		margin-right: auto,
+		padding-left: 0.5rem,
+		padding-right: 0.5rem,
+	),
+	$clay-time-edit
+);
 
 $clay-time-inner-spin: () !default;
-$clay-time-inner-spin: map-deep-merge((
-	border-color: $secondary-d1,
-	border-radius: 8px,
-	border-style: solid,
-	border-width: $btn-border-width,
-), $clay-time-inner-spin);
+$clay-time-inner-spin: map-deep-merge(
+	(
+		border-color: $secondary-d1,
+		border-radius: 8px,
+		border-style: solid,
+		border-width: $btn-border-width,
+	),
+	$clay-time-inner-spin
+);
 
 $clay-time-inner-spin-btn: () !default;
-$clay-time-inner-spin-btn: map-deep-merge((
-	align-items: center,
-	border-radius: map-get($clay-time-inner-spin, border-radius),
-	border-width: 0,
-	display: inline-flex,
-	font-size: 8px,
-	height: auto,
-	justify-content: center,
-	padding-bottom: 2px,
-	padding-left: 2px,
-	padding-right: 2px,
-	padding-top: 2px,
-	width: auto,
-), $clay-time-inner-spin-btn);
\ No newline at end of file
+$clay-time-inner-spin-btn: map-deep-merge(
+	(
+		align-items: center,
+		border-radius: map-get($clay-time-inner-spin, border-radius),
+		border-width: 0,
+		display: inline-flex,
+		font-size: 8px,
+		height: auto,
+		justify-content: center,
+		padding-bottom: 2px,
+		padding-left: 2px,
+		padding-right: 2px,
+		padding-top: 2px,
+		width: auto,
+	),
+	$clay-time-inner-spin-btn
+);
diff --git a/packages/clay-css/src/scss/variables/_timelines.scss b/packages/clay-css/src/scss/variables/_timelines.scss
index a224568853..798fcb4e9f 100644
--- a/packages/clay-css/src/scss/variables/_timelines.scss
+++ b/packages/clay-css/src/scss/variables/_timelines.scss
@@ -26,4 +26,4 @@ $timeline-item-padding-top: 5px !default;
 
 $timeline-inner-spacing-xl: 50px !default;
 $timeline-outer-spacing-xl: 25px !default;
-$timeline-item-padding-y-xl: 15px !default;
\ No newline at end of file
+$timeline-item-padding-y-xl: 15px !default;
diff --git a/packages/clay-css/src/scss/variables/_toggle-switch.scss b/packages/clay-css/src/scss/variables/_toggle-switch.scss
index 01941df983..e59ccc59c9 100644
--- a/packages/clay-css/src/scss/variables/_toggle-switch.scss
+++ b/packages/clay-css/src/scss/variables/_toggle-switch.scss
@@ -1,6 +1,8 @@
 $toggle-switch-cursor: $link-cursor !default;
 $toggle-switch-font-weight: $input-label-font-weight !default;
-$toggle-switch-transition: background-color 100ms ease-in, border-color 100ms ease-in, box-shadow 150ms ease-in-out, color 100ms ease-in, left 100ms ease-in, right 100ms ease-in !default;
+$toggle-switch-transition: background-color 100ms ease-in,
+	border-color 100ms ease-in, box-shadow 150ms ease-in-out,
+	color 100ms ease-in, left 100ms ease-in, right 100ms ease-in !default;
 
 // must all be same units--start
 $toggle-switch-bar-padding: 0 !default; // space between button and bar, can be negative value
@@ -8,7 +10,8 @@ $toggle-switch-bar-padding-mobile: $toggle-switch-bar-padding !default;
 $toggle-switch-button-width: 25px !default;
 $toggle-switch-button-width-mobile: $toggle-switch-button-width !default;
 
-$toggle-switch-bar-height: ($toggle-switch-bar-padding * 2) + $toggle-switch-button-width !default;
+$toggle-switch-bar-height: ($toggle-switch-bar-padding * 2) +
+	$toggle-switch-button-width !default;
 $toggle-switch-bar-height-mobile: $toggle-switch-bar-height !default;
 $toggle-switch-bar-width: 50px !default; // width of switch bar
 $toggle-switch-bar-width-mobile: $toggle-switch-bar-width !default;
@@ -60,4 +63,4 @@ $toggle-switch-text-disabled-color: $input-label-disabled-color !default;
 // Simple Toggle Switch
 
 $simple-toggle-switch-label-line-height: 1 !default;
-$simple-toggle-switch-label-spacer-x: 0.5rem !default;
\ No newline at end of file
+$simple-toggle-switch-label-spacer-x: 0.5rem !default;
diff --git a/packages/clay-css/src/scss/variables/_tooltip.scss b/packages/clay-css/src/scss/variables/_tooltip.scss
index 791c87bc5c..493ca6b5a6 100644
--- a/packages/clay-css/src/scss/variables/_tooltip.scss
+++ b/packages/clay-css/src/scss/variables/_tooltip.scss
@@ -1,3 +1,3 @@
 $tooltip-box-shadow: null !default;
 
-$tooltip-arrow-offset: 0.25rem !default; // 4px
\ No newline at end of file
+$tooltip-arrow-offset: 0.25rem !default; // 4px
diff --git a/packages/clay-css/src/scss/variables/_type.scss b/packages/clay-css/src/scss/variables/_type.scss
index 729a66030c..b75f977a69 100644
--- a/packages/clay-css/src/scss/variables/_type.scss
+++ b/packages/clay-css/src/scss/variables/_type.scss
@@ -8,90 +8,126 @@ $reference-mark-vertical-align: super !default;
 $mark-color: null !default;
 
 $c-kbd-group: () !default;
-$c-kbd-group: map-deep-merge((
-	font-size: 0.875rem,
-), $c-kbd-group);
+$c-kbd-group: map-deep-merge(
+	(
+		font-size: 0.875rem,
+	),
+	$c-kbd-group
+);
 
 $c-kbd: () !default;
-$c-kbd: map-deep-merge((
-	background-color: transparent,
-	border-radius: 2px,
-	border-color: transparent,
-	border-style: solid,
-	border-width: 1px,
-	box-shadow: none,
-	color: inherit,
-	display: inline-block,
-	font-family: $font-family-sans-serif,
-	font-size: 0.875rem,
-	font-weight: $font-weight-semi-bold,
-	height: 1.5rem,
-	line-height: 1.375rem,
-	min-width: 1.5rem,
-	padding: 0 0.3125rem,
-	text-align: center,
-	text-transform: capitalize,
-), $c-kbd);
+$c-kbd: map-deep-merge(
+	(
+		background-color: transparent,
+		border-radius: 2px,
+		border-color: transparent,
+		border-style: solid,
+		border-width: 1px,
+		box-shadow: none,
+		color: inherit,
+		display: inline-block,
+		font-family: $font-family-sans-serif,
+		font-size: 0.875rem,
+		font-weight: $font-weight-semi-bold,
+		height: 1.5rem,
+		line-height: 1.375rem,
+		min-width: 1.5rem,
+		padding: 0 0.3125rem,
+		text-align: center,
+		text-transform: capitalize,
+	),
+	$c-kbd
+);
 
 $c-kbd-monospaced: () !default;
-$c-kbd-monospaced: map-deep-merge((
-	padding: 0,
-), $c-kbd-monospaced);
+$c-kbd-monospaced: map-deep-merge(
+	(
+		padding: 0,
+	),
+	$c-kbd-monospaced
+);
 
 $c-kbd-inline: () !default;
-$c-kbd-inline: map-deep-merge((
-	border-width: 0,
-	font-weight: $font-weight-light,
-	height: auto,
-	line-height: inherit,
-	min-width: 0,
-	padding: 0,
-), $c-kbd-inline);
+$c-kbd-inline: map-deep-merge(
+	(
+		border-width: 0,
+		font-weight: $font-weight-light,
+		height: auto,
+		line-height: inherit,
+		min-width: 0,
+		padding: 0,
+	),
+	$c-kbd-inline
+);
 
 // Kbd Sizes
 
 $c-kbd-group-sm: () !default;
-$c-kbd-group-sm: map-deep-merge((
-	font-size: 0.75rem,
-), $c-kbd-group-sm);
+$c-kbd-group-sm: map-deep-merge(
+	(
+		font-size: 0.75rem,
+	),
+	$c-kbd-group-sm
+);
 
 $c-kbd-sm: () !default;
-$c-kbd-sm: map-deep-merge((
-	font-size: 0.75rem,
-), $c-kbd-sm);
+$c-kbd-sm: map-deep-merge(
+	(
+		font-size: 0.75rem,
+	),
+	$c-kbd-sm
+);
 
 $c-kbd-group-lg: () !default;
-$c-kbd-group-lg: map-deep-merge((
-	font-size: 1rem,
-), $c-kbd-group-lg);
+$c-kbd-group-lg: map-deep-merge(
+	(
+		font-size: 1rem,
+	),
+	$c-kbd-group-lg
+);
 
 $c-kbd-lg: () !default;
-$c-kbd-lg: map-deep-merge((
-	font-size: 1rem,
-), $c-kbd-lg);
+$c-kbd-lg: map-deep-merge(
+	(
+		font-size: 1rem,
+	),
+	$c-kbd-lg
+);
 
 // Kbd Variants
 
 $c-kbd-group-light: () !default;
-$c-kbd-group-light: map-deep-merge((
-	color: $secondary,
-), $c-kbd-group-light);
+$c-kbd-group-light: map-deep-merge(
+	(
+		color: $secondary,
+	),
+	$c-kbd-group-light
+);
 
 $c-kbd-light: () !default;
-$c-kbd-light: map-deep-merge((
-	background-color: $white,
-	border-color: $gray-400,
-	color: $secondary,
-), $c-kbd-light);
+$c-kbd-light: map-deep-merge(
+	(
+		background-color: $white,
+		border-color: $gray-400,
+		color: $secondary,
+	),
+	$c-kbd-light
+);
 
 $c-kbd-group-dark: () !default;
-$c-kbd-group-dark: map-deep-merge((
-	color: $white,
-), $c-kbd-group-dark);
+$c-kbd-group-dark: map-deep-merge(
+	(
+		color: $white,
+	),
+	$c-kbd-group-dark
+);
 
 $c-kbd-dark: () !default;
-$c-kbd-dark: map-deep-merge((
-	background-color: $dark-l2,
-	border-color: $dark-l2,
-	color: $white,
-), $c-kbd-dark);
+$c-kbd-dark: map-deep-merge(
+	(
+		background-color: $dark-l2,
+		border-color: $dark-l2,
+		color: $white,
+	),
+	$c-kbd-dark
+);
diff --git a/packages/clay-css/src/scss/variables/_utilities.scss b/packages/clay-css/src/scss/variables/_utilities.scss
index bf5b882f97..215bb94c5a 100644
--- a/packages/clay-css/src/scss/variables/_utilities.scss
+++ b/packages/clay-css/src/scss/variables/_utilities.scss
@@ -11,56 +11,65 @@ $autofit-padded-col-padding-y: 0.25rem !default; // 4px
 // Close
 
 $close: () !default;
-$close: map-deep-merge((
-	color: $black,
-	opacity: 0.5,
-	hover-opacity: 0.75,
-	focus-opacity: 0.75,
-	disabled-opacity: 0.25,
-	btn-focus-box-shadow: $input-btn-focus-box-shadow,
-	btn-focus-outline: 0,
-	align-items: center,
-	border-radius: $btn-border-radius-sm,
-	display: inline-flex,
-	font-size: 1rem,
-	justify-content: center,
-	height: 2rem,
-	text-align: center,
-	width: 2rem,
-	transition: $btn-transition,
-	lexicon-icon-margin-top: 0
-), $close);
+$close: map-deep-merge(
+	(
+		color: $black,
+		opacity: 0.5,
+		hover-opacity: 0.75,
+		focus-opacity: 0.75,
+		disabled-opacity: 0.25,
+		btn-focus-box-shadow: $input-btn-focus-box-shadow,
+		btn-focus-outline: 0,
+		align-items: center,
+		border-radius: $btn-border-radius-sm,
+		display: inline-flex,
+		font-size: 1rem,
+		justify-content: center,
+		height: 2rem,
+		text-align: center,
+		width: 2rem,
+		transition: $btn-transition,
+		lexicon-icon-margin-top: 0,
+	),
+	$close
+);
 
 // C Focus Inset
 
 $c-focus-inset-focus: () !default;
-$c-focus-inset-focus: map-deep-merge((
-	box-shadow: $component-focus-inset-box-shadow,
-	border-color: $input-btn-focus-color,
-	outline: 0,
-), $c-focus-inset-focus);
+$c-focus-inset-focus: map-deep-merge(
+	(
+		box-shadow: $component-focus-inset-box-shadow,
+		border-color: $input-btn-focus-color,
+		outline: 0,
+	),
+	$c-focus-inset-focus
+);
 
 // C Inner
 
 $c-inner: () !default;
-$c-inner: map-deep-merge((
-	align-items: inherit,
-	display: inherit,
-	flex-direction: inherit,
-	height: inherit,
-	justify-content: inherit,
-	line-height: inherit,
-	max-width: inherit,
-	min-width: inherit,
-	outline: 0,
-	overflow: inherit,
-	padding-bottom: inherit,
-	padding-left: inherit,
-	padding-right: inherit,
-	padding-top: inherit,
-	text-overflow: inherit,
-	width: inherit,
-), $c-inner);
+$c-inner: map-deep-merge(
+	(
+		align-items: inherit,
+		display: inherit,
+		flex-direction: inherit,
+		height: inherit,
+		justify-content: inherit,
+		line-height: inherit,
+		max-width: inherit,
+		min-width: inherit,
+		outline: 0,
+		overflow: inherit,
+		padding-bottom: inherit,
+		padding-left: inherit,
+		padding-right: inherit,
+		padding-top: inherit,
+		text-overflow: inherit,
+		width: inherit,
+	),
+	$c-inner
+);
 
 // Heading
 
@@ -76,4 +85,4 @@ $inline-item-spacer-x: 0.5rem !default; // 8px
 
 $inline-item-loading-animation-font-size: 1.25em !default;
 
-$page-header-bg: $gray-200 !default;
\ No newline at end of file
+$page-header-bg: $gray-200 !default;