diff --git a/docs/dist/script.js b/docs/dist/script.js
index 97a0980..88a0a6c 100644
--- a/docs/dist/script.js
+++ b/docs/dist/script.js
@@ -25555,7 +25555,7 @@
 
 	module.exports = {
 		"name": "aia",
-		"version": "0.6.2",
+		"version": "0.7.0",
 		"description": "The UI Toolkit that powers ONE's internal projects",
 		"main": "lib/index",
 		"scripts": {
diff --git a/docs/dist/style.css b/docs/dist/style.css
index 052a0c8..3f4d16f 100644
--- a/docs/dist/style.css
+++ b/docs/dist/style.css
@@ -5877,6 +5877,20 @@ hr {
   .alert.-crimson a {
     color: #9a1a0d; }
 
+/**
+ * The container to position Alert like Growl
+ *
+ * Obviously intended to be used with `alert`
+ * @see alert.scss
+ *
+ * @example
+ * <div class="alert-growl">
+ *   <div class="alert -emerald">
+ *     Your transaction was successful!
+ *   </div>
+ * </div>
+ *
+ */
 .alert-growl {
   position: fixed;
   top: 0;
@@ -6082,7 +6096,7 @@ hr {
   position: absolute;
   margin-top: 20px; }
   .dropdown > .menu {
-    box-shadow: 2px 4px 0px rgba(0, 0, 0, 0.17);
+    box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.16);
     position: relative;
     padding: 6px 0;
     min-width: 160px;
@@ -6141,7 +6155,7 @@ hr {
   .dropdown.-up {
     margin-top: -20px; }
   .dropdown.-up > .menu {
-    box-shadow: 2px -4px 0px rgba(0, 0, 0, 0.17); }
+    box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.16); }
   .dropdown.-up > .menu::before, .dropdown.-up > .menu::after {
     top: initial;
     bottom: -20px;
@@ -6429,7 +6443,7 @@ code {
   border: 1px solid #78828A; }
 
 .doc-drop-shadow-mixin-example {
-  box-shadow: 2px 4px 0px rgba(0, 0, 0, 0.17);
+  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.16);
   width: 100px;
   height: 100px;
   background: #fff;
diff --git a/styles/_utils.scss b/styles/_utils.scss
index 480d38c..f922bf4 100644
--- a/styles/_utils.scss
+++ b/styles/_utils.scss
@@ -26,11 +26,14 @@
   white-space: nowrap;
 }
 
-@mixin drop-shadow($position : 4px) {
-  @if($position) == "top" {
-    $position: -4px;
+@mixin drop-shadow($position: "bottom") {
+  @if $position == "top" {
+    $position: -2px;
+  } @else {
+    $position: 2px;
   }
-  box-shadow: 2px $position 0px rgba(0,0,0, .17);
+
+  box-shadow: 0px $position 4px 0px rgba(0,0,0,0.16);
 }
 
 // Responsive Utilities
diff --git a/styles/components/_dropdown.scss b/styles/components/_dropdown.scss
index 1160743..d1dad1d 100644
--- a/styles/components/_dropdown.scss
+++ b/styles/components/_dropdown.scss
@@ -5,7 +5,7 @@
   margin-top: ($dropdown-arrow-size * 2);
 
   > .menu {
-    @include drop-shadow;
+    @include drop-shadow("top");
     position: relative;
     padding: ($padding-x / 2) 0;
     min-width: 160px;