diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-1-snap.png
index daf6902b..50c992e5 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-input-input-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-input-input-1-snap.png
index daf6902b..50c992e5 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-input-input-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-input-input-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-input-textarea-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-input-textarea-1-snap.png
index 5ee2a970..696e11dd 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-input-textarea-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-input-textarea-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-method-add-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-method-add-1-snap.png
index daf6902b..50c992e5 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-method-add-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-method-add-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-method-edit-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-method-edit-1-snap.png
index 63bc33ce..d8ef1e16 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-method-edit-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-method-edit-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-removing-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-removing-1-snap.png
index daf6902b..50c992e5 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-removing-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-removing-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png
index dae9c509..a25cdac9 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-type-tag-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-type-tag-1-snap.png
index c68a8176..3f3db491 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-type-tag-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-type-tag-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-1-snap.png
index 5c997d49..b907d2e3 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-2-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-2-snap.png
index b907d2e3..06e13d30 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-2-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-2-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-3-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-3-snap.png
index 06e13d30..b907d2e3 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-3-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-3-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-4-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-4-snap.png
index b907d2e3..06e13d30 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-4-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/network-ui-js-network-network-4-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/tags-ui-js-renders-add-form-without-throwing-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/tags-ui-js-renders-add-form-without-throwing-1-snap.png
index c68a8176..3f3db491 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/tags-ui-js-renders-add-form-without-throwing-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/tags-ui-js-renders-add-form-without-throwing-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/tags-ui-js-renders-edit-form-without-throwing-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/tags-ui-js-renders-edit-form-without-throwing-1-snap.png
index c9597baa..7e323efc 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/tags-ui-js-renders-edit-form-without-throwing-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/tags-ui-js-renders-edit-form-without-throwing-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__snapshots__/cns.spec.js.snap b/packages/my-joy-beta/src/components/__tests__/__snapshots__/cns.spec.js.snap
index e499a16f..287eeb63 100644
--- a/packages/my-joy-beta/src/components/__tests__/__snapshots__/cns.spec.js.snap
+++ b/packages/my-joy-beta/src/components/__tests__/__snapshots__/cns.spec.js.snap
@@ -5,7 +5,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c6 {
+.c7 {
   margin-top: 1.3125rem;
   margin-left: 0.75rem;
 }
@@ -50,7 +50,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
   display: block;
 }
 
-.c9 {
+.c10 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -63,36 +63,36 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c9::-moz-focus-inner,
-.c9[type='button']::-moz-focus-inner,
-.c9[type='reset']::-moz-focus-inner,
-.c9[type='submit']::-moz-focus-inner {
+.c10::-moz-focus-inner,
+.c10[type='button']::-moz-focus-inner,
+.c10[type='reset']::-moz-focus-inner,
+.c10[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c9:-moz-focusring,
-.c9[type='button']:-moz-focusring,
-.c9[type='reset']:-moz-focusring,
-.c9[type='submit']:-moz-focusring {
+.c10:-moz-focusring,
+.c10[type='button']:-moz-focusring,
+.c10[type='reset']:-moz-focusring,
+.c10[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
+.c9 {
+  display: inline-block;
+}
+
 .c9 + button,
 .c9 + a {
   margin-left: 0.375rem;
 }
 
 .c8 {
-  display: inline-block;
-}
-
-.c8 + button,
-.c8 + a {
-  margin-left: 0.375rem;
-}
-
-.c7 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -132,7 +132,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c7:focus {
+.c8:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -140,21 +140,21 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c7:hover {
+.c8:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c7:active,
-.c7:active:hover,
-.c7:active:focus {
+.c8:active,
+.c8:active:hover,
+.c8:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c7[disabled] {
+.c8[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
@@ -174,7 +174,23 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
-.c11 {
+.c6 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
+.c12 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -193,7 +209,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c10 {
+.c11 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -309,6 +325,9 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
             placeholder="Example: mySQLdb"
             required={true}
           />
+          <label
+            className="c6"
+          />
         </div>
       </div>
     </div>
@@ -316,10 +335,10 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
       className="c1"
     >
       <div
-        className="c6"
+        className="c7"
       >
         <button
-          className="c7 c8 c9"
+          className="c8 c9 c10"
           disabled={undefined}
           href=""
           type="submit"
@@ -327,7 +346,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
           Add
         </button>
         <div
-          className="c10 c11"
+          className="c11 c12"
           height="0.25rem"
         />
       </div>
@@ -341,7 +360,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c6 {
+.c7 {
   margin-top: 1.3125rem;
   margin-left: 0.75rem;
 }
@@ -386,7 +405,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
   display: block;
 }
 
-.c9 {
+.c10 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -399,36 +418,36 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c9::-moz-focus-inner,
-.c9[type='button']::-moz-focus-inner,
-.c9[type='reset']::-moz-focus-inner,
-.c9[type='submit']::-moz-focus-inner {
+.c10::-moz-focus-inner,
+.c10[type='button']::-moz-focus-inner,
+.c10[type='reset']::-moz-focus-inner,
+.c10[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c9:-moz-focusring,
-.c9[type='button']:-moz-focusring,
-.c9[type='reset']:-moz-focusring,
-.c9[type='submit']:-moz-focusring {
+.c10:-moz-focusring,
+.c10[type='button']:-moz-focusring,
+.c10[type='reset']:-moz-focusring,
+.c10[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
+.c9 {
+  display: inline-block;
+}
+
 .c9 + button,
 .c9 + a {
   margin-left: 0.375rem;
 }
 
 .c8 {
-  display: inline-block;
-}
-
-.c8 + button,
-.c8 + a {
-  margin-left: 0.375rem;
-}
-
-.c7 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -473,7 +492,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
   border-color: rgb(216,216,216);
 }
 
-.c7:focus {
+.c8:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -481,38 +500,38 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c7:hover {
+.c8:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c7:active,
-.c7:active:hover,
-.c7:active:focus {
+.c8:active,
+.c8:active:hover,
+.c8:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c7[disabled] {
+.c8[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c7:focus {
+.c8:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c7:hover {
+.c8:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c7:active,
-.c7:active:hover,
-.c7:active:focus {
+.c8:active,
+.c8:active:hover,
+.c8:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
@@ -532,7 +551,23 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
-.c11 {
+.c6 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
+.c12 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -551,7 +586,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c10 {
+.c11 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -667,6 +702,9 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
             placeholder="Example: mySQLdb"
             required={true}
           />
+          <label
+            className="c6"
+          />
         </div>
       </div>
     </div>
@@ -674,10 +712,10 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
       className="c1"
     >
       <div
-        className="c6"
+        className="c7"
       >
         <button
-          className="c7 c8 c9"
+          className="c8 c9 c10"
           disabled={true}
           href=""
           type="submit"
@@ -685,7 +723,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
           Add
         </button>
         <div
-          className="c10 c11"
+          className="c11 c12"
           height="0.25rem"
         />
       </div>
diff --git a/packages/my-joy-beta/src/components/__tests__/__snapshots__/key-value.spec.js.snap b/packages/my-joy-beta/src/components/__tests__/__snapshots__/key-value.spec.js.snap
index 83de1fd0..d9aee612 100644
--- a/packages/my-joy-beta/src/components/__tests__/__snapshots__/key-value.spec.js.snap
+++ b/packages/my-joy-beta/src/components/__tests__/__snapshots__/key-value.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders <KeyValue /> without throwing 1`] = `
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -14,36 +14,36 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c25 + button,
+.c25 + a {
+  margin-left: 0.375rem;
+}
+
+.c24 {
+  display: inline-block;
+}
+
 .c24 + button,
 .c24 + a {
   margin-left: 0.375rem;
 }
 
 .c23 {
-  display: inline-block;
-}
-
-.c23 + button,
-.c23 + a {
-  margin-left: 0.375rem;
-}
-
-.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -88,7 +88,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -96,43 +96,43 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -178,7 +178,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -186,43 +186,43 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -280,7 +280,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -288,66 +288,66 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -366,6 +366,22 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c16 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -385,7 +401,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -414,7 +430,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   display: block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -424,7 +440,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -459,7 +475,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -555,7 +571,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c18 {
+.c19 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -830,7 +846,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -839,7 +855,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -857,7 +873,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -866,7 +882,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     display: none;
   }
 }
@@ -947,13 +963,17 @@ exports[`renders <KeyValue /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c18"
+            className="c19"
           />
           <div
             className="c11"
@@ -985,23 +1005,27 @@ exports[`renders <KeyValue /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
         <div
-          className="c19"
+          className="c20"
         >
           <div
-            className="c20"
+            className="c21"
           >
             <div
-              className="c21"
+              className="c22"
             >
               <button
-                className="c22 c23 c24"
+                className="c23 c24 c25"
                 disabled={false}
                 href=""
                 onClick={[Function]}
@@ -1012,7 +1036,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
                 </span>
               </button>
               <button
-                className="c25 c23 c24"
+                className="c26 c24 c25"
                 disabled={true}
                 href=""
                 type="submit"
@@ -1023,10 +1047,10 @@ exports[`renders <KeyValue /> without throwing 1`] = `
               </button>
             </div>
             <div
-              className="c26"
+              className="c27"
             >
               <button
-                className="c27 c23 c24"
+                className="c28 c24 c25"
                 disabled={false}
                 href=""
                 icon={true}
@@ -1304,7 +1328,7 @@ exports[`renders <KeyValue expanded={false} /> without throwing 1`] = `
 `;
 
 exports[`renders <KeyValue input="input" /> without throwing 1`] = `
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -1317,36 +1341,36 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c25 + button,
+.c25 + a {
+  margin-left: 0.375rem;
+}
+
+.c24 {
+  display: inline-block;
+}
+
 .c24 + button,
 .c24 + a {
   margin-left: 0.375rem;
 }
 
 .c23 {
-  display: inline-block;
-}
-
-.c23 + button,
-.c23 + a {
-  margin-left: 0.375rem;
-}
-
-.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1391,7 +1415,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1399,43 +1423,43 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1481,7 +1505,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1489,43 +1513,43 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1583,7 +1607,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1591,66 +1615,66 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -1669,6 +1693,22 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c16 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -1688,7 +1728,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1717,7 +1757,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   display: block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1727,7 +1767,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1762,7 +1802,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -1858,7 +1898,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c18 {
+.c19 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -2133,7 +2173,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -2142,7 +2182,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -2160,7 +2200,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -2169,7 +2209,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     display: none;
   }
 }
@@ -2250,13 +2290,17 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c18"
+            className="c19"
           />
           <div
             className="c11"
@@ -2288,23 +2332,27 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
         <div
-          className="c19"
+          className="c20"
         >
           <div
-            className="c20"
+            className="c21"
           >
             <div
-              className="c21"
+              className="c22"
             >
               <button
-                className="c22 c23 c24"
+                className="c23 c24 c25"
                 disabled={false}
                 href=""
                 onClick={[Function]}
@@ -2315,7 +2363,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
                 </span>
               </button>
               <button
-                className="c25 c23 c24"
+                className="c26 c24 c25"
                 disabled={true}
                 href=""
                 type="submit"
@@ -2326,10 +2374,10 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
               </button>
             </div>
             <div
-              className="c26"
+              className="c27"
             >
               <button
-                className="c27 c23 c24"
+                className="c28 c24 c25"
                 disabled={false}
                 href=""
                 icon={true}
@@ -2368,7 +2416,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
 `;
 
 exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -2381,27 +2429,27 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button,
-.c24 + a {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c19 {
   position: relative;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
@@ -2414,16 +2462,16 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   max-width: 100%;
 }
 
-.c23 {
+.c24 {
   display: inline-block;
 }
 
-.c23 + button,
-.c23 + a {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2468,7 +2516,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2476,43 +2524,43 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2558,7 +2606,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2566,43 +2614,43 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2660,7 +2708,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2668,66 +2716,66 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -2746,6 +2794,22 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c17 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -2765,7 +2829,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -2804,7 +2868,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -2835,7 +2899,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   margin-top: 0.75rem;
 }
 
-.c17 {
+.c18 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -2846,7 +2910,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   margin-top: 0.375rem;
 }
 
@@ -3134,7 +3198,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   color: rgba(73,73,73,0.5);
 }
 
-.c19 {
+.c20 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 6rem;
@@ -3159,58 +3223,58 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   resize: vertical;
 }
 
-.c19:focus {
+.c20:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c19::-webkit-input-placeholder {
+.c20::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19::-moz-placeholder {
+.c20::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:-ms-input-placeholder {
+.c20:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:invalid {
+.c20:invalid {
   box-shadow: none;
 }
 
-.c19:disabled {
+.c20:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled {
+.c20:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
@@ -3227,7 +3291,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -3236,7 +3300,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -3263,7 +3327,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     display: none;
   }
 }
@@ -3342,12 +3406,16 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
                 >
                   <div
                     className="c16"
-                  />
+                  >
+                    <label
+                      className="c17"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
             <div
-              className="c17 c10"
+              className="c18 c10"
               height="0.75rem"
             />
           </div>
@@ -3375,7 +3443,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
                 className="c14"
               >
                 <textarea
-                  className="c18 c19"
+                  className="c19 c20"
                   disabled={false}
                   id="p"
                   onBlur={undefined}
@@ -3386,26 +3454,30 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
               >
                 <div
                   className="c16"
-                />
+                >
+                  <label
+                    className="c17"
+                  />
+                </div>
               </div>
             </div>
             <div
-              className="c17 c10"
+              className="c18 c10"
               height="0.75rem"
             />
           </div>
         </div>
         <div
-          className="c20"
+          className="c21"
         >
           <div
-            className="c21"
+            className="c22"
           >
             <div
               className="c11"
             >
               <button
-                className="c22 c23 c24"
+                className="c23 c24 c25"
                 disabled={false}
                 href=""
                 onClick={[Function]}
@@ -3416,7 +3488,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
                 </span>
               </button>
               <button
-                className="c25 c23 c24"
+                className="c26 c24 c25"
                 disabled={true}
                 href=""
                 type="submit"
@@ -3427,10 +3499,10 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
               </button>
             </div>
             <div
-              className="c26"
+              className="c27"
             >
               <button
-                className="c27 c23 c24"
+                className="c28 c24 c25"
                 disabled={false}
                 href=""
                 icon={true}
@@ -3469,7 +3541,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
 `;
 
 exports[`renders <KeyValue method="add" /> without throwing 1`] = `
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -3482,36 +3554,36 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c25 + button,
+.c25 + a {
+  margin-left: 0.375rem;
+}
+
+.c24 {
+  display: inline-block;
+}
+
 .c24 + button,
 .c24 + a {
   margin-left: 0.375rem;
 }
 
 .c23 {
-  display: inline-block;
-}
-
-.c23 + button,
-.c23 + a {
-  margin-left: 0.375rem;
-}
-
-.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3556,7 +3628,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3564,43 +3636,43 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3646,7 +3718,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3654,43 +3726,43 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3748,7 +3820,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3756,66 +3828,66 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -3834,6 +3906,22 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c16 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -3853,7 +3941,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -3882,7 +3970,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   display: block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -3892,7 +3980,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -3927,7 +4015,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -4023,7 +4111,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c18 {
+.c19 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -4298,7 +4386,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -4307,7 +4395,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -4325,7 +4413,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -4334,7 +4422,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     display: none;
   }
 }
@@ -4415,13 +4503,17 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c18"
+            className="c19"
           />
           <div
             className="c11"
@@ -4453,23 +4545,27 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
         <div
-          className="c19"
+          className="c20"
         >
           <div
-            className="c20"
+            className="c21"
           >
             <div
-              className="c21"
+              className="c22"
             >
               <button
-                className="c22 c23 c24"
+                className="c23 c24 c25"
                 disabled={false}
                 href=""
                 onClick={[Function]}
@@ -4480,7 +4576,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
                 </span>
               </button>
               <button
-                className="c25 c23 c24"
+                className="c26 c24 c25"
                 disabled={true}
                 href=""
                 type="submit"
@@ -4491,10 +4587,10 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
               </button>
             </div>
             <div
-              className="c26"
+              className="c27"
             >
               <button
-                className="c27 c23 c24"
+                className="c28 c24 c25"
                 disabled={false}
                 href=""
                 icon={true}
@@ -4533,7 +4629,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
 `;
 
 exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -4546,36 +4642,36 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c25 + button,
+.c25 + a {
+  margin-left: 0.375rem;
+}
+
+.c24 {
+  display: inline-block;
+}
+
 .c24 + button,
 .c24 + a {
   margin-left: 0.375rem;
 }
 
 .c23 {
-  display: inline-block;
-}
-
-.c23 + button,
-.c23 + a {
-  margin-left: 0.375rem;
-}
-
-.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4620,7 +4716,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4628,43 +4724,43 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4710,7 +4806,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4718,43 +4814,43 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4812,7 +4908,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4820,66 +4916,66 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -4898,6 +4994,22 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c16 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -4917,7 +5029,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -4946,7 +5058,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   display: block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4956,7 +5068,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4970,7 +5082,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -5066,7 +5178,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c18 {
+.c19 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -5352,7 +5464,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -5361,7 +5473,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -5379,7 +5491,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -5388,7 +5500,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     -webkit-flex-basis: 41.66666666666667%;
     -ms-flex-preferred-size: 41.66666666666667%;
     flex-basis: 41.66666666666667%;
@@ -5489,13 +5601,17 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c18"
+            className="c19"
           />
           <div
             className="c11"
@@ -5527,23 +5643,27 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
         <div
-          className="c19"
+          className="c20"
         >
           <div
-            className="c20"
+            className="c21"
           >
             <div
-              className="c21"
+              className="c22"
             >
               <button
-                className="c22 c23 c24"
+                className="c23 c24 c25"
                 disabled={false}
                 href=""
                 onClick={[Function]}
@@ -5554,7 +5674,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
                 </span>
               </button>
               <button
-                className="c25 c23 c24"
+                className="c26 c24 c25"
                 disabled={true}
                 href=""
                 type="submit"
@@ -5565,10 +5685,10 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
               </button>
             </div>
             <div
-              className="c26"
+              className="c27"
             >
               <button
-                className="c27 c23 c24"
+                className="c28 c24 c25"
                 disabled={false}
                 href=""
                 icon={true}
@@ -5607,7 +5727,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
 `;
 
 exports[`renders <KeyValue removing /> without throwing 1`] = `
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -5620,34 +5740,34 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button,
-.c24 + a {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
-.c29 {
+.c30 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
   animation: iCqDak 1.5s ease-out 0s infinite;
 }
 
-.c30 {
+.c31 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -5656,7 +5776,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   animation-delay: 0.5s;
 }
 
-.c31 {
+.c32 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -5665,7 +5785,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   animation-delay: 1s;
 }
 
-.c28 {
+.c29 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -5693,16 +5813,16 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   flex: 1 0 auto;
 }
 
-.c23 {
+.c24 {
   display: inline-block;
 }
 
-.c23 + button,
-.c23 + a {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -5747,7 +5867,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -5755,43 +5875,43 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -5837,7 +5957,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -5845,43 +5965,43 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -5944,7 +6064,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -5952,83 +6072,83 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -6047,6 +6167,22 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c16 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -6066,7 +6202,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -6095,7 +6231,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   display: block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -6105,7 +6241,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -6140,7 +6276,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -6236,7 +6372,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c18 {
+.c19 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -6511,7 +6647,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -6520,7 +6656,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -6538,7 +6674,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -6547,7 +6683,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     display: none;
   }
 }
@@ -6628,13 +6764,17 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c18"
+            className="c19"
           />
           <div
             className="c11"
@@ -6666,23 +6806,27 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
         <div
-          className="c19"
+          className="c20"
         >
           <div
-            className="c20"
+            className="c21"
           >
             <div
-              className="c21"
+              className="c22"
             >
               <button
-                className="c22 c23 c24"
+                className="c23 c24 c25"
                 disabled={false}
                 href=""
                 onClick={[Function]}
@@ -6693,7 +6837,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
                 </span>
               </button>
               <button
-                className="c25 c23 c24"
+                className="c26 c24 c25"
                 disabled={true}
                 href=""
                 type="submit"
@@ -6704,10 +6848,10 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
               </button>
             </div>
             <div
-              className="c26"
+              className="c27"
             >
               <button
-                className="c27 c23 c24"
+                className="c28 c24 c25"
                 disabled={false}
                 href=""
                 icon={true}
@@ -6715,28 +6859,28 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
                 type="button"
               >
                 <div
-                  className="c28"
+                  className="c29"
                 >
                   <svg
                     height="10"
                     width="28"
                   >
                     <rect
-                      className="c29"
+                      className="c30"
                       height="6"
                       width="6"
                       x="2"
                       y="2"
                     />
                     <rect
-                      className="c30"
+                      className="c31"
                       height="6"
                       width="6"
                       x="11"
                       y="2"
                     />
                     <rect
-                      className="c31"
+                      className="c32"
                       height="6"
                       width="6"
                       x="20"
@@ -6755,7 +6899,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
 `;
 
 exports[`renders <KeyValue submitting /> without throwing 1`] = `
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -6768,34 +6912,34 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button,
-.c24 + a {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
-.c27 {
+.c28 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
   animation: iCqDak 1.5s ease-out 0s infinite;
 }
 
-.c28 {
+.c29 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -6804,7 +6948,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   animation-delay: 0.5s;
 }
 
-.c29 {
+.c30 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -6813,7 +6957,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   animation-delay: 1s;
 }
 
-.c26 {
+.c27 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -6841,16 +6985,16 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   flex: 1 0 auto;
 }
 
-.c23 {
+.c24 {
   display: inline-block;
 }
 
-.c23 + button,
-.c23 + a {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -6896,7 +7040,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -6904,43 +7048,43 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c31 {
+.c32 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -7003,7 +7147,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   float: right;
 }
 
-.c31:focus {
+.c32:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -7011,87 +7155,87 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c31:hover {
+.c32:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c31:active,
-.c31:active:hover,
-.c31:active:focus {
+.c32:active,
+.c32:active:hover,
+.c32:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c31[disabled] {
+.c32[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c31:focus {
+.c32:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c31:hover {
+.c32:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c31:active,
-.c31:active:hover,
-.c31:active:focus {
+.c32:active,
+.c32:active:hover,
+.c32:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c31:focus {
+.c32:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c31:hover {
+.c32:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c31:active,
-.c31:active:hover,
-.c31:active:focus {
+.c32:active,
+.c32:active:hover,
+.c32:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c31:focus {
+.c32:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c31:hover {
+.c32:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c31:active,
-.c31:active:hover,
-.c31:active:focus {
+.c32:active,
+.c32:active:hover,
+.c32:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c31 svg + span {
+.c32 svg + span {
   margin-left: 0.75rem;
 }
 
-.c31 svg {
+.c32 svg {
   max-height: 1.125rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -7141,7 +7285,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -7149,55 +7293,55 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
@@ -7217,6 +7361,22 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c16 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -7236,7 +7396,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -7265,7 +7425,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   display: block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -7275,7 +7435,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   display: block;
 }
 
-.c30 {
+.c31 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -7310,7 +7470,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -7406,7 +7566,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c18 {
+.c19 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -7696,7 +7856,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -7705,7 +7865,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -7723,7 +7883,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -7732,7 +7892,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c30 {
+  .c31 {
     display: none;
   }
 }
@@ -7813,13 +7973,17 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c18"
+            className="c19"
           />
           <div
             className="c11"
@@ -7851,23 +8015,27 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
         <div
-          className="c19"
+          className="c20"
         >
           <div
-            className="c20"
+            className="c21"
           >
             <div
-              className="c21"
+              className="c22"
             >
               <button
-                className="c22 c23 c24"
+                className="c23 c24 c25"
                 disabled={true}
                 href=""
                 onClick={[Function]}
@@ -7878,34 +8046,34 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
                 </span>
               </button>
               <button
-                className="c25 c23 c24"
+                className="c26 c24 c25"
                 disabled={true}
                 href=""
                 type="submit"
               >
                 <div
-                  className="c26"
+                  className="c27"
                 >
                   <svg
                     height="10"
                     width="28"
                   >
                     <rect
-                      className="c27"
+                      className="c28"
                       height="6"
                       width="6"
                       x="2"
                       y="2"
                     />
                     <rect
-                      className="c28"
+                      className="c29"
                       height="6"
                       width="6"
                       x="11"
                       y="2"
                     />
                     <rect
-                      className="c29"
+                      className="c30"
                       height="6"
                       width="6"
                       x="20"
@@ -7916,10 +8084,10 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
               </button>
             </div>
             <div
-              className="c30"
+              className="c31"
             >
               <button
-                className="c31 c23 c24"
+                className="c32 c24 c25"
                 disabled={true}
                 href=""
                 icon={true}
@@ -7958,7 +8126,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
 `;
 
 exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -7971,36 +8139,36 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c25 + button,
+.c25 + a {
+  margin-left: 0.375rem;
+}
+
+.c24 {
+  display: inline-block;
+}
+
 .c24 + button,
 .c24 + a {
   margin-left: 0.375rem;
 }
 
 .c23 {
-  display: inline-block;
-}
-
-.c23 + button,
-.c23 + a {
-  margin-left: 0.375rem;
-}
-
-.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -8045,7 +8213,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -8053,43 +8221,43 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -8135,7 +8303,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -8143,43 +8311,43 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -8237,7 +8405,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -8245,66 +8413,66 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -8323,6 +8491,22 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c16 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -8342,7 +8526,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -8371,7 +8555,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   display: block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -8381,7 +8565,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -8416,7 +8600,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -8512,7 +8696,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c18 {
+.c19 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -8787,7 +8971,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -8796,7 +8980,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -8814,7 +8998,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -8823,7 +9007,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     display: none;
   }
 }
@@ -8904,13 +9088,17 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c18"
+            className="c19"
           />
           <div
             className="c11"
@@ -8942,23 +9130,27 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
         <div
-          className="c19"
+          className="c20"
         >
           <div
-            className="c20"
+            className="c21"
           >
             <div
-              className="c21"
+              className="c22"
             >
               <button
-                className="c22 c23 c24"
+                className="c23 c24 c25"
                 disabled={false}
                 href=""
                 onClick={[Function]}
@@ -8969,7 +9161,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
                 </span>
               </button>
               <button
-                className="c25 c23 c24"
+                className="c26 c24 c25"
                 disabled={true}
                 href=""
                 type="submit"
@@ -8980,10 +9172,10 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
               </button>
             </div>
             <div
-              className="c26"
+              className="c27"
             >
               <button
-                className="c27 c23 c24"
+                className="c28 c24 c25"
                 disabled={false}
                 href=""
                 icon={true}
diff --git a/packages/my-joy-beta/src/components/__tests__/__snapshots__/tags.spec.js.snap b/packages/my-joy-beta/src/components/__tests__/__snapshots__/tags.spec.js.snap
index c4722325..4dab6b61 100644
--- a/packages/my-joy-beta/src/components/__tests__/__snapshots__/tags.spec.js.snap
+++ b/packages/my-joy-beta/src/components/__tests__/__snapshots__/tags.spec.js.snap
@@ -5,7 +5,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -18,7 +18,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
   padding: 1.125rem;
 }
 
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -31,36 +31,36 @@ exports[`renders <AddForm /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c25 + button,
+.c25 + a {
+  margin-left: 0.375rem;
+}
+
+.c24 {
+  display: inline-block;
+}
+
 .c24 + button,
 .c24 + a {
   margin-left: 0.375rem;
 }
 
 .c23 {
-  display: inline-block;
-}
-
-.c23 + button,
-.c23 + a {
-  margin-left: 0.375rem;
-}
-
-.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -105,7 +105,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -113,43 +113,43 @@ exports[`renders <AddForm /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -195,7 +195,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -203,43 +203,43 @@ exports[`renders <AddForm /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -297,7 +297,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -305,66 +305,66 @@ exports[`renders <AddForm /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -383,6 +383,22 @@ exports[`renders <AddForm /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c16 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -402,7 +418,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -431,7 +447,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
   display: block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -441,7 +457,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -555,7 +571,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c18 {
+.c19 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -830,7 +846,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -839,7 +855,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -857,7 +873,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -866,7 +882,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     display: none;
   }
 }
@@ -947,13 +963,17 @@ exports[`renders <AddForm /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c18"
+            className="c19"
           />
           <div
             className="c11"
@@ -985,23 +1005,27 @@ exports[`renders <AddForm /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
         <div
-          className="c19"
+          className="c20"
         >
           <div
-            className="c20"
+            className="c21"
           >
             <div
-              className="c21"
+              className="c22"
             >
               <button
-                className="c22 c23 c24"
+                className="c23 c24 c25"
                 disabled={false}
                 href=""
                 onClick={[Function]}
@@ -1012,7 +1036,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
                 </span>
               </button>
               <button
-                className="c25 c23 c24"
+                className="c26 c24 c25"
                 disabled={true}
                 href=""
                 type="submit"
@@ -1023,10 +1047,10 @@ exports[`renders <AddForm /> without throwing 1`] = `
               </button>
             </div>
             <div
-              className="c26"
+              className="c27"
             >
               <button
-                className="c27 c23 c24"
+                className="c28 c24 c25"
                 disabled={false}
                 href=""
                 icon={true}
@@ -1069,7 +1093,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -1082,7 +1106,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   padding: 1.125rem;
 }
 
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -1095,36 +1119,36 @@ exports[`renders <EditForm /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c25 + button,
+.c25 + a {
+  margin-left: 0.375rem;
+}
+
+.c24 {
+  display: inline-block;
+}
+
 .c24 + button,
 .c24 + a {
   margin-left: 0.375rem;
 }
 
 .c23 {
-  display: inline-block;
-}
-
-.c23 + button,
-.c23 + a {
-  margin-left: 0.375rem;
-}
-
-.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1169,7 +1193,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1177,43 +1201,43 @@ exports[`renders <EditForm /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1259,7 +1283,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1267,43 +1291,43 @@ exports[`renders <EditForm /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1361,7 +1385,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1369,66 +1393,66 @@ exports[`renders <EditForm /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -1447,6 +1471,22 @@ exports[`renders <EditForm /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c16 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -1466,7 +1506,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1495,7 +1535,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   display: block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1505,7 +1545,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1598,7 +1638,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c18 {
+.c19 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -1884,7 +1924,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -1893,7 +1933,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -1911,7 +1951,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -1920,7 +1960,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     -webkit-flex-basis: 41.66666666666667%;
     -ms-flex-preferred-size: 41.66666666666667%;
     flex-basis: 41.66666666666667%;
@@ -2021,13 +2061,17 @@ exports[`renders <EditForm /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c18"
+            className="c19"
           />
           <div
             className="c11"
@@ -2059,23 +2103,27 @@ exports[`renders <EditForm /> without throwing 1`] = `
                 >
                   <div
                     className="c17"
-                  />
+                  >
+                    <label
+                      className="c18"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
         <div
-          className="c19"
+          className="c20"
         >
           <div
-            className="c20"
+            className="c21"
           >
             <div
-              className="c21"
+              className="c22"
             >
               <button
-                className="c22 c23 c24"
+                className="c23 c24 c25"
                 disabled={false}
                 href=""
                 onClick={[Function]}
@@ -2086,7 +2134,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
                 </span>
               </button>
               <button
-                className="c25 c23 c24"
+                className="c26 c24 c25"
                 disabled={true}
                 href=""
                 type="submit"
@@ -2097,10 +2145,10 @@ exports[`renders <EditForm /> without throwing 1`] = `
               </button>
             </div>
             <div
-              className="c26"
+              className="c27"
             >
               <button
-                className="c27 c23 c24"
+                className="c28 c24 c25"
                 disabled={false}
                 href=""
                 icon={true}
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/affinity-ui-js-rule-1-snap.png b/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/affinity-ui-js-rule-1-snap.png
index eda58e61..50244cca 100644
Binary files a/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/affinity-ui-js-rule-1-snap.png and b/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/affinity-ui-js-rule-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/affinity-ui-js-rule-2-snap.png b/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/affinity-ui-js-rule-2-snap.png
index eda58e61..50244cca 100644
Binary files a/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/affinity-ui-js-rule-2-snap.png and b/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/affinity-ui-js-rule-2-snap.png differ
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/images-ui-js-images-images-name-stuff-image-name-stuff-1-snap.png b/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/images-ui-js-images-images-name-stuff-image-name-stuff-1-snap.png
index c3fbb7a6..e57cb0fe 100644
Binary files a/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/images-ui-js-images-images-name-stuff-image-name-stuff-1-snap.png and b/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/images-ui-js-images-images-name-stuff-image-name-stuff-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/package-ui-js-package-1-snap.png b/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/package-ui-js-package-1-snap.png
index 9627750f..496929b6 100644
Binary files a/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/package-ui-js-package-1-snap.png and b/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/package-ui-js-package-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/affinity.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/affinity.spec.js.snap
index 4e6e5e5a..aeecfdf2 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/affinity.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/affinity.spec.js.snap
@@ -190,6 +190,22 @@ exports[`renders <Rule/> without throwing 1`] = `
   display: none;
 }
 
+.c16 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c2 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -907,6 +923,9 @@ exports[`renders <Rule/> without throwing 1`] = `
           }
         }
       />
+      <label
+        className="c16"
+      />
     </div>
   </div>
 </div>
@@ -1052,6 +1071,22 @@ exports[`renders <Rule/> without throwing 2`] = `
   display: none;
 }
 
+.c16 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c2 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -1769,6 +1804,9 @@ exports[`renders <Rule/> without throwing 2`] = `
           }
         }
       />
+      <label
+        className="c16"
+      />
     </div>
   </div>
 </div>
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap
index 67fd7552..dad36435 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap
@@ -5,7 +5,7 @@ exports[`renders <Name /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c9 {
+.c10 {
   margin-left: 0.375rem;
 }
 
@@ -53,7 +53,7 @@ exports[`renders <Name /> without throwing 1`] = `
   display: flex;
 }
 
-.c6 {
+.c7 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -70,7 +70,7 @@ exports[`renders <Name /> without throwing 1`] = `
   display: block;
 }
 
-.c12 {
+.c13 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -83,36 +83,36 @@ exports[`renders <Name /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c12::-moz-focus-inner,
-.c12[type='button']::-moz-focus-inner,
-.c12[type='reset']::-moz-focus-inner,
-.c12[type='submit']::-moz-focus-inner {
+.c13::-moz-focus-inner,
+.c13[type='button']::-moz-focus-inner,
+.c13[type='reset']::-moz-focus-inner,
+.c13[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c12:-moz-focusring,
-.c12[type='button']:-moz-focusring,
-.c12[type='reset']:-moz-focusring,
-.c12[type='submit']:-moz-focusring {
+.c13:-moz-focusring,
+.c13[type='button']:-moz-focusring,
+.c13[type='reset']:-moz-focusring,
+.c13[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c13 + button,
+.c13 + a {
+  margin-left: 0.375rem;
+}
+
+.c12 {
+  display: inline-block;
+}
+
 .c12 + button,
 .c12 + a {
   margin-left: 0.375rem;
 }
 
 .c11 {
-  display: inline-block;
-}
-
-.c11 + button,
-.c11 + a {
-  margin-left: 0.375rem;
-}
-
-.c10 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -166,7 +166,7 @@ exports[`renders <Name /> without throwing 1`] = `
   margin-top: 0.5rem;
 }
 
-.c10:focus {
+.c11:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -174,47 +174,47 @@ exports[`renders <Name /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c10:hover {
+.c11:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c10:active,
-.c10:active:hover,
-.c10:active:focus {
+.c11:active,
+.c11:active:hover,
+.c11:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c10[disabled] {
+.c11[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c10:focus {
+.c11:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c10:hover {
+.c11:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c10:active,
-.c10:active:hover,
-.c10:active:focus {
+.c11:active,
+.c11:active:hover,
+.c11:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c10 svg + span {
+.c11 svg + span {
   margin-left: 0.75rem;
 }
 
-.c10 svg {
+.c11 svg {
   max-height: 1.125rem;
 }
 
@@ -233,7 +233,23 @@ exports[`renders <Name /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
-.c8 {
+.c6 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
+.c9 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -252,7 +268,7 @@ exports[`renders <Name /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c7 {
+.c8 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -367,20 +383,23 @@ exports[`renders <Name /> without throwing 1`] = `
             placeholder={undefined}
           />
         </div>
+        <label
+          className="c6"
+        />
       </div>
     </div>
     <div
-      className="c6"
+      className="c7"
     >
       <div
-        className="c7 c8"
+        className="c8 c9"
         height="0.8125rem"
       />
       <div
-        className="c9"
+        className="c10"
       >
         <button
-          className="c10 c11 c12"
+          className="c11 c12 c13"
           href=""
           icon={true}
           onClick={undefined}
@@ -421,7 +440,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c9 {
+.c10 {
   margin-left: 0.375rem;
 }
 
@@ -469,7 +488,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   display: flex;
 }
 
-.c6 {
+.c7 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -486,7 +505,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   display: block;
 }
 
-.c12 {
+.c13 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -499,36 +518,36 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c12::-moz-focus-inner,
-.c12[type='button']::-moz-focus-inner,
-.c12[type='reset']::-moz-focus-inner,
-.c12[type='submit']::-moz-focus-inner {
+.c13::-moz-focus-inner,
+.c13[type='button']::-moz-focus-inner,
+.c13[type='reset']::-moz-focus-inner,
+.c13[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c12:-moz-focusring,
-.c12[type='button']:-moz-focusring,
-.c12[type='reset']:-moz-focusring,
-.c12[type='submit']:-moz-focusring {
+.c13:-moz-focusring,
+.c13[type='button']:-moz-focusring,
+.c13[type='reset']:-moz-focusring,
+.c13[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c13 + button,
+.c13 + a {
+  margin-left: 0.375rem;
+}
+
+.c12 {
+  display: inline-block;
+}
+
 .c12 + button,
 .c12 + a {
   margin-left: 0.375rem;
 }
 
 .c11 {
-  display: inline-block;
-}
-
-.c11 + button,
-.c11 + a {
-  margin-left: 0.375rem;
-}
-
-.c10 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -582,7 +601,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   margin-top: 0.5rem;
 }
 
-.c10:focus {
+.c11:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -590,47 +609,47 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c10:hover {
+.c11:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c10:active,
-.c10:active:hover,
-.c10:active:focus {
+.c11:active,
+.c11:active:hover,
+.c11:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c10[disabled] {
+.c11[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c10:focus {
+.c11:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c10:hover {
+.c11:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c10:active,
-.c10:active:hover,
-.c10:active:focus {
+.c11:active,
+.c11:active:hover,
+.c11:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c10 svg + span {
+.c11 svg + span {
   margin-left: 0.75rem;
 }
 
-.c10 svg {
+.c11 svg {
   max-height: 1.125rem;
 }
 
@@ -649,7 +668,23 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
-.c8 {
+.c6 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
+.c9 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -668,7 +703,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c7 {
+.c8 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -783,20 +818,23 @@ exports[`renders <Name expanded /> without throwing 1`] = `
             placeholder={undefined}
           />
         </div>
+        <label
+          className="c6"
+        />
       </div>
     </div>
     <div
-      className="c6"
+      className="c7"
     >
       <div
-        className="c7 c8"
+        className="c8 c9"
         height="0.8125rem"
       />
       <div
-        className="c9"
+        className="c10"
       >
         <button
-          className="c10 c11 c12"
+          className="c11 c12 c13"
           href=""
           icon={true}
           onClick={undefined}
@@ -837,7 +875,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c9 {
+.c10 {
   margin-left: 0.375rem;
 }
 
@@ -885,7 +923,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
   display: flex;
 }
 
-.c6 {
+.c7 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -902,7 +940,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
   display: block;
 }
 
-.c12 {
+.c13 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -915,36 +953,36 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c12::-moz-focus-inner,
-.c12[type='button']::-moz-focus-inner,
-.c12[type='reset']::-moz-focus-inner,
-.c12[type='submit']::-moz-focus-inner {
+.c13::-moz-focus-inner,
+.c13[type='button']::-moz-focus-inner,
+.c13[type='reset']::-moz-focus-inner,
+.c13[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c12:-moz-focusring,
-.c12[type='button']:-moz-focusring,
-.c12[type='reset']:-moz-focusring,
-.c12[type='submit']:-moz-focusring {
+.c13:-moz-focusring,
+.c13[type='button']:-moz-focusring,
+.c13[type='reset']:-moz-focusring,
+.c13[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c13 + button,
+.c13 + a {
+  margin-left: 0.375rem;
+}
+
+.c12 {
+  display: inline-block;
+}
+
 .c12 + button,
 .c12 + a {
   margin-left: 0.375rem;
 }
 
 .c11 {
-  display: inline-block;
-}
-
-.c11 + button,
-.c11 + a {
-  margin-left: 0.375rem;
-}
-
-.c10 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -998,7 +1036,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
   margin-top: 0.5rem;
 }
 
-.c10:focus {
+.c11:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1006,47 +1044,47 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c10:hover {
+.c11:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c10:active,
-.c10:active:hover,
-.c10:active:focus {
+.c11:active,
+.c11:active:hover,
+.c11:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c10[disabled] {
+.c11[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c10:focus {
+.c11:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c10:hover {
+.c11:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c10:active,
-.c10:active:hover,
-.c10:active:focus {
+.c11:active,
+.c11:active:hover,
+.c11:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c10 svg + span {
+.c11 svg + span {
   margin-left: 0.75rem;
 }
 
-.c10 svg {
+.c11 svg {
   max-height: 1.125rem;
 }
 
@@ -1065,7 +1103,23 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
-.c8 {
+.c6 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
+.c9 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1084,7 +1138,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c7 {
+.c8 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -1199,20 +1253,23 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
             placeholder={undefined}
           />
         </div>
+        <label
+          className="c6"
+        />
       </div>
     </div>
     <div
-      className="c6"
+      className="c7"
     >
       <div
-        className="c7 c8"
+        className="c8 c9"
         height="0.8125rem"
       />
       <div
-        className="c9"
+        className="c10"
       >
         <button
-          className="c10 c11 c12"
+          className="c11 c12 c13"
           href=""
           icon={true}
           onClick={undefined}
@@ -1253,7 +1310,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c9 {
+.c10 {
   margin-left: 0.375rem;
 }
 
@@ -1301,7 +1358,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
   display: flex;
 }
 
-.c6 {
+.c7 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -1318,7 +1375,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
   display: block;
 }
 
-.c12 {
+.c13 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -1331,36 +1388,36 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c12::-moz-focus-inner,
-.c12[type='button']::-moz-focus-inner,
-.c12[type='reset']::-moz-focus-inner,
-.c12[type='submit']::-moz-focus-inner {
+.c13::-moz-focus-inner,
+.c13[type='button']::-moz-focus-inner,
+.c13[type='reset']::-moz-focus-inner,
+.c13[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c12:-moz-focusring,
-.c12[type='button']:-moz-focusring,
-.c12[type='reset']:-moz-focusring,
-.c12[type='submit']:-moz-focusring {
+.c13:-moz-focusring,
+.c13[type='button']:-moz-focusring,
+.c13[type='reset']:-moz-focusring,
+.c13[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c13 + button,
+.c13 + a {
+  margin-left: 0.375rem;
+}
+
+.c12 {
+  display: inline-block;
+}
+
 .c12 + button,
 .c12 + a {
   margin-left: 0.375rem;
 }
 
 .c11 {
-  display: inline-block;
-}
-
-.c11 + button,
-.c11 + a {
-  margin-left: 0.375rem;
-}
-
-.c10 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1414,7 +1471,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
   margin-top: 0.5rem;
 }
 
-.c10:focus {
+.c11:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1422,47 +1479,47 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c10:hover {
+.c11:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c10:active,
-.c10:active:hover,
-.c10:active:focus {
+.c11:active,
+.c11:active:hover,
+.c11:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c10[disabled] {
+.c11[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c10:focus {
+.c11:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c10:hover {
+.c11:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c10:active,
-.c10:active:hover,
-.c10:active:focus {
+.c11:active,
+.c11:active:hover,
+.c11:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c10 svg + span {
+.c11 svg + span {
   margin-left: 0.75rem;
 }
 
-.c10 svg {
+.c11 svg {
   max-height: 1.125rem;
 }
 
@@ -1481,7 +1538,23 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
-.c8 {
+.c6 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
+.c9 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1500,7 +1573,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c7 {
+.c8 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -1615,20 +1688,23 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
             placeholder={undefined}
           />
         </div>
+        <label
+          className="c6"
+        />
       </div>
     </div>
     <div
-      className="c6"
+      className="c7"
     >
       <div
-        className="c7 c8"
+        className="c8 c9"
         height="0.8125rem"
       />
       <div
-        className="c9"
+        className="c10"
       >
         <button
-          className="c10 c11 c12"
+          className="c11 c12 c13"
           href=""
           icon={true}
           onClick={undefined}
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap
index 6c5a5b6a..3653e078 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap
@@ -932,6 +932,11 @@ exports[`renders <Package /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c12 {
+  display: inline-block;
+  margin-right: 0.375rem;
+}
+
 .c9 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1243,7 +1248,11 @@ exports[`renders <Package /> without throwing 1`] = `
     name="td"
     selected={false}
   >
-    1
+    <div
+      className="c12"
+    >
+      1
+    </div>
   </td>
   <td
     className="c2"
diff --git a/packages/my-joy-beta/src/components/create-instance/package.js b/packages/my-joy-beta/src/components/create-instance/package.js
index b33a4909..6807c172 100644
--- a/packages/my-joy-beta/src/components/create-instance/package.js
+++ b/packages/my-joy-beta/src/components/create-instance/package.js
@@ -151,11 +151,9 @@ export const Package = ({
       {bytes(memory, { decimalPlaces: 0, unitSeparator: ' ' })}
     </TableTd>
     <TableTd right selected={selected} bold={sortBy === 'disk'}>
-      {bytes(disk, { decimalPlaces: 0, unitSeparator: ' ' })}
+      <Margin inline right={1}>{bytes(disk, { decimalPlaces: 0, unitSeparator: ' ' })}</Margin>
       {ssd && (
-        <Margin inline left={1}>
           <Sup badge>SSD</Sup>
-        </Margin>
       )}
     </TableTd>
     {hasVms && (
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/list-ui-js-item-mutating-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/list-ui-js-item-mutating-1-snap.png
index 3dcf40f6..1f7d1427 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/list-ui-js-item-mutating-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/list-ui-js-item-mutating-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/metadata-ui-js-add-form-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/metadata-ui-js-add-form-1-snap.png
index 5ee2a970..696e11dd 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/metadata-ui-js-add-form-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/metadata-ui-js-add-form-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/metadata-ui-js-edit-form-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/metadata-ui-js-edit-form-1-snap.png
index aa7146ca..2d138755 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/metadata-ui-js-edit-form-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/metadata-ui-js-edit-form-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/snapshots-ui-js-item-mutating-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/snapshots-ui-js-item-mutating-1-snap.png
index bad817a0..1334f990 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/snapshots-ui-js-item-mutating-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/snapshots-ui-js-item-mutating-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png
index 259d93b0..41b7d996 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap
index 2a2b040b..6ac80bae 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap
@@ -1,1107 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders <AddForm /> without throwing 1`] = `
-.c24 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c24 + button,
-.c24 + a {
-  margin-left: 0.375rem;
-}
-
-.c18 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-  max-width: 100%;
-}
-
-.c23 {
-  display: inline-block;
-}
-
-.c23 + button,
-.c23 + a {
-  margin-left: 0.375rem;
-}
-
-.c22 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  margin: 0;
-}
-
-.c22:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c22:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c22[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c22:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c25 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  margin: 0;
-}
-
-.c25:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c25:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c25[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c25:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c25:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c27 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  margin: 0;
-  float: right;
-}
-
-.c27:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c27:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c27[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c27:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c27:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c27:focus {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c27:hover {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
-  background-color: rgba(210,67,58,0.1);
-  border-color: rgb(205,37,27);
-}
-
-.c27 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c27 svg {
-  max-height: 1.125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  line-height: 1.125rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-bottom: 0.1875rem;
-  margin-right: 0.75rem;
-  font-weight: 600;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c10 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.625rem;
-  margin-left: -0.625rem;
-}
-
-.c21 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.625rem;
-  margin-left: -0.625rem;
-}
-
-.c11 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
-.c16 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
-.c26 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
-.c7 {
-  color: rgba(73,73,73,1);
-  font-weight: 600;
-  line-height: 1.5rem;
-  font-size: 0.9375rem;
-  margin: 0;
-}
-
-.c7 + p,
-.c7 + small,
-.c7 + h1,
-.c7 + h2,
-.c7 + label,
-.c7 + h3,
-.c7 + h4,
-.c7 + h5,
-.c7 + div,
-.c7 + span {
-  margin-top: 0.75rem;
-}
-
-.c17 {
-  background-color: rgb(216,216,216);
-  margin: 0;
-  background-color: transparent;
-  height: 0.75rem;
-}
-
-.c14 {
-  margin-top: 0.1875rem;
-}
-
-.c20 {
-  margin-top: 0.375rem;
-}
-
-.c3 {
-  padding-right: 1.125rem;
-  padding-left: 1.125rem;
-}
-
-.c9 {
-  padding: 1.125rem;
-}
-
-.c4 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-  -webkit-flex-basis: 100%;
-  -ms-flex-preferred-size: 100%;
-  flex-basis: 100%;
-}
-
-.c0 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
-}
-
-.c1 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  min-height: auto;
-  height: 2.875rem;
-  -webkit-flex: 0 0 2.875rem;
-  -ms-flex: 0 0 2.875rem;
-  flex: 0 0 2.875rem;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  z-index: 1;
-  line-height: 1.5rem;
-  height: auto;
-  max-width: 100%;
-  margin: -0.0625rem -0.0625rem 0 -0.0625rem;
-}
-
-.c1 button {
-  margin-bottom: 0;
-  margin-top: 0;
-}
-
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  min-height: auto;
-  height: 2.875rem;
-  -webkit-flex: 0 0 2.875rem;
-  -ms-flex: 0 0 2.875rem;
-  flex: 0 0 2.875rem;
-  box-sizing: border-box;
-  min-height: 2.9375rem;
-  max-width: 100%;
-  width: auto;
-  height: auto;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: stretch;
-  -webkit-box-align: stretch;
-  -ms-flex-align: stretch;
-  align-items: stretch;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  overflow: hidden;
-  background-color: transparent;
-  border-width: 0;
-  box-shadow: none;
-  color: inherit;
-}
-
-.c8 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c8 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c8 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
-.c12 {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  border: none;
-  overflow: hidden;
-  height: auto;
-  -webkit-margin-start: 0;
-  -webkit-margin-end: 0;
-  -webkit-padding-before: 0;
-  -webkit-padding-start: 0;
-  -webkit-padding-end: 0;
-  -webkit-padding-after: 0;
-  width: 100%;
-}
-
-.c15 {
-  box-sizing: border-box;
-  width: 18.75rem;
-  height: 3rem;
-  min-height: 3rem;
-  padding: 0.8125rem 0.75rem;
-  border-radius: 0.25rem;
-  background-color: rgb(255,255,255);
-  border: 0.0625rem solid rgb(216,216,216);
-  color: rgba(73,73,73,1);
-  font-size: 0.9375rem;
-  line-height: normal !important;
-  font-style: normal;
-  font-stretch: normal;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  outline: 0;
-  max-width: 22.1875rem;
-  text-overflow: ellipsis;
-}
-
-.c15:focus {
-  border-color: rgb(59,70,204);
-  outline: 0;
-}
-
-.c15::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c15::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c15:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c15:invalid {
-  box-shadow: none;
-}
-
-.c15:disabled {
-  background-color: rgb(250,250,250);
-  color: rgb(216,216,216);
-  cursor: not-allowed;
-}
-
-.c15:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c15:disabled::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c15:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c19 {
-  box-sizing: border-box;
-  width: 18.75rem;
-  height: 6rem;
-  min-height: 6rem;
-  padding: 0.8125rem 0.75rem;
-  border-radius: 0.25rem;
-  background-color: rgb(255,255,255);
-  border: 0.0625rem solid rgb(216,216,216);
-  color: rgba(73,73,73,1);
-  font-size: 0.9375rem;
-  line-height: normal !important;
-  font-style: normal;
-  font-stretch: normal;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  outline: 0;
-  font-family: "Roboto Mono",monospace;
-  width: 100%;
-  min-width: 100%;
-  text-overflow: ellipsis;
-  resize: vertical;
-}
-
-.c19:focus {
-  border-color: rgb(59,70,204);
-  outline: 0;
-}
-
-.c19::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c19::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c19:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c19:invalid {
-  box-shadow: none;
-}
-
-.c19:disabled {
-  background-color: rgb(250,250,250);
-  color: rgb(216,216,216);
-  cursor: not-allowed;
-}
-
-.c19:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c19:disabled::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c19:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c19:disabled {
-  color: rgba(73,73,73,1);
-}
-
-.c19:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c19:disabled::-moz-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c19:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c2 {
-  word-wrap: break-word;
-  overflow-wrap: break-word;
-  width: 100%;
-  box-sizing: border-box;
-}
-
-.c5 {
-  height: 2.9375rem;
-  max-width: 98%;
-}
-
-@media only screen and (min-width:0em) {
-  .c21 {
-    -webkit-align-items: center;
-    -webkit-box-align: center;
-    -ms-flex-align: center;
-    align-items: center;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c21 {
-    -webkit-box-pack: justify;
-    -webkit-justify-content: space-between;
-    -ms-flex-pack: justify;
-    justify-content: space-between;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c11 {
-    -webkit-flex-basis: 100%;
-    -ms-flex-preferred-size: 100%;
-    flex-basis: 100%;
-    max-width: 100%;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c16 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c26 {
-    display: none;
-  }
-}
-
-<form
-  onSubmit={undefined}
->
-  <div
-    className="c0"
-    disabled={false}
-    name="card"
-  >
-    <div
-      className="c1"
-      disabled={false}
-      name="card-header"
-      onClick={false}
-    >
-      <div
-        className="c2 c3"
-      >
-        <div
-          className="c4"
-        >
-          <div
-            className="c5 c6"
-            disabled={false}
-            name="card-header-meta"
-          >
-            <h4
-              className="c7"
-            >
-              Add metadata
-            </h4>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div
-      className="c8"
-      name="card-outlet"
-    >
-      <div
-        className="c9"
-      >
-        <div
-          className="c10"
-        >
-          <div
-            className="c11"
-          >
-            <div
-              className="baseline-jVaZNU kXgQxt c12"
-              name="name"
-              role="group"
-              style={undefined}
-            >
-              <label
-                className="c13"
-                htmlFor="k"
-              >
-                Metadata
-                 key
-              </label>
-              <div
-                className="c14"
-              >
-                <input
-                  className="c15"
-                  disabled={false}
-                  id="k"
-                  onBlur={null}
-                />
-                <div
-                  className="c10"
-                >
-                  <div
-                    className="c16"
-                  />
-                </div>
-              </div>
-            </div>
-            <div
-              className="c17 c10"
-              height="0.75rem"
-            />
-          </div>
-        </div>
-        <div
-          className="c10"
-        >
-          <div
-            className="c11"
-          >
-            <div
-              className="baseline-jVaZNU kXgQxt c12"
-              name="value"
-              role="group"
-              style={undefined}
-            >
-              <label
-                className="c13"
-                htmlFor="l"
-              >
-                Metadata
-                 value
-              </label>
-              <div
-                className="c14"
-              >
-                <textarea
-                  className="c18 c19"
-                  disabled={false}
-                  id="l"
-                  onBlur={undefined}
-                />
-              </div>
-              <div
-                className="c10"
-              >
-                <div
-                  className="c16"
-                />
-              </div>
-            </div>
-            <div
-              className="c17 c10"
-              height="0.75rem"
-            />
-          </div>
-        </div>
-        <div
-          className="c20"
-        >
-          <div
-            className="c21"
-          >
-            <div
-              className="c11"
-            >
-              <button
-                className="c22 c23 c24"
-                disabled={false}
-                href=""
-                onClick={[Function]}
-                type="button"
-              >
-                <span>
-                  Cancel
-                </span>
-              </button>
-              <button
-                className="c25 c23 c24"
-                disabled={true}
-                href=""
-                type="submit"
-              >
-                <span>
-                  Create
-                </span>
-              </button>
-            </div>
-            <div
-              className="c26"
-            >
-              <button
-                className="c27 c23 c24"
-                disabled={false}
-                href=""
-                icon={true}
-                onClick={[Function]}
-                type="button"
-              >
-                <svg
-                  className=""
-                  height="16"
-                  innerRef={undefined}
-                  style={
-                    Object {
-                      "transform": "rotate(0deg)",
-                    }
-                  }
-                  viewBox="0 0 12 16"
-                  width="12"
-                  xmlns="http://www.w3.org/2000/svg"
-                >
-                  <path
-                    d="M2.67,0V1.5H0V3H12V1.5H9.33V0ZM0,4,1.33,16h9.34L12,4ZM8,5h2.51l-1,10H8ZM1.49,5H4V15H2.53ZM7,15H5V5H7Z"
-                    fill="rgb(210, 67, 58)"
-                  />
-                </svg>
-                <span>
-                  Remove
-                </span>
-              </button>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</form>
-`;
-
-exports[`renders <EditForm /> without throwing 1`] = `
 .c25 {
   font-family: sans-serif;
   font-size: 100%;
@@ -1135,7 +34,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c19 {
   position: relative;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
@@ -1480,6 +379,22 @@ exports[`renders <EditForm /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c17 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -1499,7 +414,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1538,16 +453,6 @@ exports[`renders <EditForm /> without throwing 1`] = `
   display: block;
 }
 
-.c22 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
 .c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
@@ -1558,7 +463,28 @@ exports[`renders <EditForm /> without throwing 1`] = `
   display: block;
 }
 
-.c17 {
+.c7 {
+  color: rgba(73,73,73,1);
+  font-weight: 600;
+  line-height: 1.5rem;
+  font-size: 0.9375rem;
+  margin: 0;
+}
+
+.c7 + p,
+.c7 + small,
+.c7 + h1,
+.c7 + h2,
+.c7 + label,
+.c7 + h3,
+.c7 + h4,
+.c7 + h5,
+.c7 + div,
+.c7 + span {
+  margin-top: 0.75rem;
+}
+
+.c18 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -1569,7 +495,1121 @@ exports[`renders <EditForm /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
+.c21 {
+  margin-top: 0.375rem;
+}
+
+.c3 {
+  padding-right: 1.125rem;
+  padding-left: 1.125rem;
+}
+
+.c9 {
+  padding: 1.125rem;
+}
+
+.c4 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  -webkit-flex-basis: 100%;
+  -ms-flex-preferred-size: 100%;
+  flex-basis: 100%;
+}
+
+.c0 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
+}
+
+.c1 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  min-height: auto;
+  height: 2.875rem;
+  -webkit-flex: 0 0 2.875rem;
+  -ms-flex: 0 0 2.875rem;
+  flex: 0 0 2.875rem;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  z-index: 1;
+  line-height: 1.5rem;
+  height: auto;
+  max-width: 100%;
+  margin: -0.0625rem -0.0625rem 0 -0.0625rem;
+}
+
+.c1 button {
+  margin-bottom: 0;
+  margin-top: 0;
+}
+
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  min-height: auto;
+  height: 2.875rem;
+  -webkit-flex: 0 0 2.875rem;
+  -ms-flex: 0 0 2.875rem;
+  flex: 0 0 2.875rem;
+  box-sizing: border-box;
+  min-height: 2.9375rem;
+  max-width: 100%;
+  width: auto;
+  height: auto;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: stretch;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  overflow: hidden;
+  background-color: transparent;
+  border-width: 0;
+  box-shadow: none;
+  color: inherit;
+}
+
+.c8 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c8 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c8 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
+.c12 {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  height: auto;
+  -webkit-margin-start: 0;
+  -webkit-margin-end: 0;
+  -webkit-padding-before: 0;
+  -webkit-padding-start: 0;
+  -webkit-padding-end: 0;
+  -webkit-padding-after: 0;
+  width: 100%;
+}
+
+.c15 {
+  box-sizing: border-box;
+  width: 18.75rem;
+  height: 3rem;
+  min-height: 3rem;
+  padding: 0.8125rem 0.75rem;
+  border-radius: 0.25rem;
+  background-color: rgb(255,255,255);
+  border: 0.0625rem solid rgb(216,216,216);
+  color: rgba(73,73,73,1);
+  font-size: 0.9375rem;
+  line-height: normal !important;
+  font-style: normal;
+  font-stretch: normal;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  outline: 0;
+  max-width: 22.1875rem;
+  text-overflow: ellipsis;
+}
+
+.c15:focus {
+  border-color: rgb(59,70,204);
+  outline: 0;
+}
+
+.c15::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c15::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c15:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c15:invalid {
+  box-shadow: none;
+}
+
+.c15:disabled {
+  background-color: rgb(250,250,250);
+  color: rgb(216,216,216);
+  cursor: not-allowed;
+}
+
+.c15:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c15:disabled::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c15:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
 .c20 {
+  box-sizing: border-box;
+  width: 18.75rem;
+  height: 6rem;
+  min-height: 6rem;
+  padding: 0.8125rem 0.75rem;
+  border-radius: 0.25rem;
+  background-color: rgb(255,255,255);
+  border: 0.0625rem solid rgb(216,216,216);
+  color: rgba(73,73,73,1);
+  font-size: 0.9375rem;
+  line-height: normal !important;
+  font-style: normal;
+  font-stretch: normal;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  outline: 0;
+  font-family: "Roboto Mono",monospace;
+  width: 100%;
+  min-width: 100%;
+  text-overflow: ellipsis;
+  resize: vertical;
+}
+
+.c20:focus {
+  border-color: rgb(59,70,204);
+  outline: 0;
+}
+
+.c20::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c20::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c20:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c20:invalid {
+  box-shadow: none;
+}
+
+.c20:disabled {
+  background-color: rgb(250,250,250);
+  color: rgb(216,216,216);
+  cursor: not-allowed;
+}
+
+.c20:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c20:disabled::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c20:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c20:disabled {
+  color: rgba(73,73,73,1);
+}
+
+.c20:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c20:disabled::-moz-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c20:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c2 {
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.c5 {
+  height: 2.9375rem;
+  max-width: 98%;
+}
+
+@media only screen and (min-width:0em) {
+  .c22 {
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c22 {
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c11 {
+    -webkit-flex-basis: 100%;
+    -ms-flex-preferred-size: 100%;
+    flex-basis: 100%;
+    max-width: 100%;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c16 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c27 {
+    display: none;
+  }
+}
+
+<form
+  onSubmit={undefined}
+>
+  <div
+    className="c0"
+    disabled={false}
+    name="card"
+  >
+    <div
+      className="c1"
+      disabled={false}
+      name="card-header"
+      onClick={false}
+    >
+      <div
+        className="c2 c3"
+      >
+        <div
+          className="c4"
+        >
+          <div
+            className="c5 c6"
+            disabled={false}
+            name="card-header-meta"
+          >
+            <h4
+              className="c7"
+            >
+              Add metadata
+            </h4>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      className="c8"
+      name="card-outlet"
+    >
+      <div
+        className="c9"
+      >
+        <div
+          className="c10"
+        >
+          <div
+            className="c11"
+          >
+            <div
+              className="baseline-jVaZNU kXgQxt c12"
+              name="name"
+              role="group"
+              style={undefined}
+            >
+              <label
+                className="c13"
+                htmlFor="k"
+              >
+                Metadata
+                 key
+              </label>
+              <div
+                className="c14"
+              >
+                <input
+                  className="c15"
+                  disabled={false}
+                  id="k"
+                  onBlur={null}
+                />
+                <div
+                  className="c10"
+                >
+                  <div
+                    className="c16"
+                  >
+                    <label
+                      className="c17"
+                    />
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="c18 c10"
+              height="0.75rem"
+            />
+          </div>
+        </div>
+        <div
+          className="c10"
+        >
+          <div
+            className="c11"
+          >
+            <div
+              className="baseline-jVaZNU kXgQxt c12"
+              name="value"
+              role="group"
+              style={undefined}
+            >
+              <label
+                className="c13"
+                htmlFor="l"
+              >
+                Metadata
+                 value
+              </label>
+              <div
+                className="c14"
+              >
+                <textarea
+                  className="c19 c20"
+                  disabled={false}
+                  id="l"
+                  onBlur={undefined}
+                />
+              </div>
+              <div
+                className="c10"
+              >
+                <div
+                  className="c16"
+                >
+                  <label
+                    className="c17"
+                  />
+                </div>
+              </div>
+            </div>
+            <div
+              className="c18 c10"
+              height="0.75rem"
+            />
+          </div>
+        </div>
+        <div
+          className="c21"
+        >
+          <div
+            className="c22"
+          >
+            <div
+              className="c11"
+            >
+              <button
+                className="c23 c24 c25"
+                disabled={false}
+                href=""
+                onClick={[Function]}
+                type="button"
+              >
+                <span>
+                  Cancel
+                </span>
+              </button>
+              <button
+                className="c26 c24 c25"
+                disabled={true}
+                href=""
+                type="submit"
+              >
+                <span>
+                  Create
+                </span>
+              </button>
+            </div>
+            <div
+              className="c27"
+            >
+              <button
+                className="c28 c24 c25"
+                disabled={false}
+                href=""
+                icon={true}
+                onClick={[Function]}
+                type="button"
+              >
+                <svg
+                  className=""
+                  height="16"
+                  innerRef={undefined}
+                  style={
+                    Object {
+                      "transform": "rotate(0deg)",
+                    }
+                  }
+                  viewBox="0 0 12 16"
+                  width="12"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M2.67,0V1.5H0V3H12V1.5H9.33V0ZM0,4,1.33,16h9.34L12,4ZM8,5h2.51l-1,10H8ZM1.49,5H4V15H2.53ZM7,15H5V5H7Z"
+                    fill="rgb(210, 67, 58)"
+                  />
+                </svg>
+                <span>
+                  Remove
+                </span>
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</form>
+`;
+
+exports[`renders <EditForm /> without throwing 1`] = `
+.c26 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c26::-moz-focus-inner,
+.c26[type='button']::-moz-focus-inner,
+.c26[type='reset']::-moz-focus-inner,
+.c26[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c26:-moz-focusring,
+.c26[type='button']:-moz-focusring,
+.c26[type='reset']:-moz-focusring,
+.c26[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c26 + button,
+.c26 + a {
+  margin-left: 0.375rem;
+}
+
+.c19 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+  max-width: 100%;
+}
+
+.c25 {
+  display: inline-block;
+}
+
+.c25 + button,
+.c25 + a {
+  margin-left: 0.375rem;
+}
+
+.c24 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  margin: 0;
+}
+
+.c24:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c24:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c24[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c24:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c27 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  margin: 0;
+}
+
+.c27:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c27:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c27[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c27:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c27:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c29 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  margin: 0;
+  float: right;
+}
+
+.c29:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c29:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c29[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c29:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c29:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c29:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c29:hover {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c29 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c29 svg {
+  max-height: 1.125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  margin-right: 0.75rem;
+  font-weight: 600;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c17 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
+.c10 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.625rem;
+  margin-left: -0.625rem;
+}
+
+.c22 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.625rem;
+  margin-left: -0.625rem;
+}
+
+.c11 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c16 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c23 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c28 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c18 {
+  background-color: rgb(216,216,216);
+  margin: 0;
+  background-color: transparent;
+  height: 0.75rem;
+}
+
+.c14 {
+  margin-top: 0.1875rem;
+}
+
+.c21 {
   margin-top: 0.375rem;
 }
 
@@ -1859,7 +1899,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
   color: rgba(73,73,73,0.5);
 }
 
-.c19 {
+.c20 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 6rem;
@@ -1884,58 +1924,58 @@ exports[`renders <EditForm /> without throwing 1`] = `
   resize: vertical;
 }
 
-.c19:focus {
+.c20:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c19::-webkit-input-placeholder {
+.c20::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19::-moz-placeholder {
+.c20::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:-ms-input-placeholder {
+.c20:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:invalid {
+.c20:invalid {
   box-shadow: none;
 }
 
-.c19:disabled {
+.c20:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled {
+.c20:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
@@ -1961,7 +2001,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -1970,7 +2010,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -1997,7 +2037,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c22 {
+  .c23 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -2006,7 +2046,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c27 {
+  .c28 {
     -webkit-flex-basis: 41.66666666666667%;
     -ms-flex-preferred-size: 41.66666666666667%;
     flex-basis: 41.66666666666667%;
@@ -2105,12 +2145,16 @@ exports[`renders <EditForm /> without throwing 1`] = `
                 >
                   <div
                     className="c16"
-                  />
+                  >
+                    <label
+                      className="c17"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
             <div
-              className="c17 c10"
+              className="c18 c10"
               height="0.75rem"
             />
           </div>
@@ -2138,7 +2182,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
                 className="c14"
               >
                 <textarea
-                  className="c18 c19"
+                  className="c19 c20"
                   disabled={false}
                   id="n"
                   onBlur={undefined}
@@ -2149,26 +2193,30 @@ exports[`renders <EditForm /> without throwing 1`] = `
               >
                 <div
                   className="c16"
-                />
+                >
+                  <label
+                    className="c17"
+                  />
+                </div>
               </div>
             </div>
             <div
-              className="c17 c10"
+              className="c18 c10"
               height="0.75rem"
             />
           </div>
         </div>
         <div
-          className="c20"
+          className="c21"
         >
           <div
-            className="c21"
+            className="c22"
           >
             <div
-              className="c22"
+              className="c23"
             >
               <button
-                className="c23 c24 c25"
+                className="c24 c25 c26"
                 disabled={false}
                 href=""
                 onClick={[Function]}
@@ -2179,7 +2227,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
                 </span>
               </button>
               <button
-                className="c26 c24 c25"
+                className="c27 c25 c26"
                 disabled={true}
                 href=""
                 type="submit"
@@ -2190,10 +2238,10 @@ exports[`renders <EditForm /> without throwing 1`] = `
               </button>
             </div>
             <div
-              className="c27"
+              className="c28"
             >
               <button
-                className="c28 c24 c25"
+                className="c29 c25 c26"
                 disabled={false}
                 href=""
                 icon={true}
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-add-open-expanded-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-add-open-expanded-1-snap.png
index 5ecc0a89..bcadeebb 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-add-open-expanded-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-add-open-expanded-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png
index 6db37e97..cabab821 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-expanded-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-expanded-1-snap.png
index 3dd7a401..6842788c 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-expanded-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-expanded-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/networks-ui-js-networks-loading-expanded-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/networks-ui-js-networks-loading-expanded-1-snap.png
index 51bae4c3..4ab3f03b 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/networks-ui-js-networks-loading-expanded-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/networks-ui-js-networks-loading-expanded-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/tag-ui-js-tags-add-open-expanded-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/tag-ui-js-tags-add-open-expanded-1-snap.png
index 7b7cf6c5..0a3c392c 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/tag-ui-js-tags-add-open-expanded-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/tag-ui-js-tags-add-open-expanded-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-1-snap.png
index 79e12fff..80dedd57 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-1-snap.png
index 48c8304d..1211eb99 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-create-form-open-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-create-form-open-1-snap.png
index c944bc38..fc290cb4 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-create-form-open-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-create-form-open-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-edit-form-open-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-edit-form-open-1-snap.png
index cdc5916f..4cfedd98 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-edit-form-open-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-edit-form-open-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-edit-form-open-script-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-edit-form-open-script-1-snap.png
index cdc5916f..4cfedd98 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-edit-form-open-script-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-expanded-edit-form-open-script-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-proceeded-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-proceeded-1-snap.png
index aa999095..d96678cc 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-proceeded-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/user-script-ui-js-user-script-proceeded-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap
index 08554c17..abafee1a 100644
--- a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap
@@ -418,7 +418,7 @@ Array [
         s
     </h3>
 </div>,
-  .c24 {
+  .c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -431,27 +431,27 @@ Array [
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button,
-.c24 + a {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c19 {
   position: relative;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
@@ -464,16 +464,16 @@ Array [
   max-width: 100%;
 }
 
-.c23 {
+.c24 {
   display: inline-block;
 }
 
-.c23 + button,
-.c23 + a {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -518,7 +518,7 @@ Array [
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -526,43 +526,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -608,7 +608,7 @@ Array [
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -616,43 +616,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -710,7 +710,7 @@ Array [
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -718,66 +718,66 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -796,6 +796,22 @@ Array [
   font-size: 0.8125rem;
 }
 
+.c17 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -815,7 +831,7 @@ Array [
   margin-left: -0.625rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -854,7 +870,7 @@ Array [
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -885,7 +901,7 @@ Array [
   margin-top: 0.75rem;
 }
 
-.c17 {
+.c18 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -896,7 +912,7 @@ Array [
   margin-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   margin-top: 0.375rem;
 }
 
@@ -1184,7 +1200,7 @@ Array [
   color: rgba(73,73,73,0.5);
 }
 
-.c19 {
+.c20 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 6rem;
@@ -1209,58 +1225,58 @@ Array [
   resize: vertical;
 }
 
-.c19:focus {
+.c20:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c19::-webkit-input-placeholder {
+.c20::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19::-moz-placeholder {
+.c20::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:-ms-input-placeholder {
+.c20:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:invalid {
+.c20:invalid {
   box-shadow: none;
 }
 
-.c19:disabled {
+.c20:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled {
+.c20:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
@@ -1277,7 +1293,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -1286,7 +1302,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -1313,7 +1329,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     display: none;
   }
 }
@@ -1392,12 +1408,16 @@ Array [
                                 >
                                     <div
                                         className="c16"
-                                    />
+                                    >
+                                        <label
+                                            className="c17"
+                                        />
+                                    </div>
                                 </div>
                             </div>
                         </div>
                         <div
-                            className="c17 c10"
+                            className="c18 c10"
                             height="0.75rem"
                         />
                     </div>
@@ -1425,7 +1445,7 @@ Array [
                                 className="c14"
                             >
                                 <textarea
-                                    className="c18 c19"
+                                    className="c19 c20"
                                     disabled={false}
                                     id="t"
                                     onBlur={undefined}
@@ -1436,26 +1456,30 @@ Array [
                             >
                                 <div
                                     className="c16"
-                                />
+                                >
+                                    <label
+                                        className="c17"
+                                    />
+                                </div>
                             </div>
                         </div>
                         <div
-                            className="c17 c10"
+                            className="c18 c10"
                             height="0.75rem"
                         />
                     </div>
                 </div>
                 <div
-                    className="c20"
+                    className="c21"
                 >
                     <div
-                        className="c21"
+                        className="c22"
                     >
                         <div
                             className="c11"
                         >
                             <button
-                                className="c22 c23 c24"
+                                className="c23 c24 c25"
                                 disabled={false}
                                 href=""
                                 onClick={[Function]}
@@ -1466,7 +1490,7 @@ Array [
                                 </span>
                             </button>
                             <button
-                                className="c25 c23 c24"
+                                className="c26 c24 c25"
                                 disabled={true}
                                 href=""
                                 type="submit"
@@ -1477,10 +1501,10 @@ Array [
                             </button>
                         </div>
                         <div
-                            className="c26"
+                            className="c27"
                         >
                             <button
-                                className="c27 c23 c24"
+                                className="c28 c24 c25"
                                 disabled={false}
                                 href=""
                                 icon={true}
@@ -2413,7 +2437,7 @@ Array [
         />
     </div>
 </div>,
-  .c25 {
+  .c26 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -2426,27 +2450,27 @@ Array [
   min-width: 7.5rem;
 }
 
-.c25::-moz-focus-inner,
-.c25[type='button']::-moz-focus-inner,
-.c25[type='reset']::-moz-focus-inner,
-.c25[type='submit']::-moz-focus-inner {
+.c26::-moz-focus-inner,
+.c26[type='button']::-moz-focus-inner,
+.c26[type='reset']::-moz-focus-inner,
+.c26[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c25:-moz-focusring,
-.c25[type='button']:-moz-focusring,
-.c25[type='reset']:-moz-focusring,
-.c25[type='submit']:-moz-focusring {
+.c26:-moz-focusring,
+.c26[type='button']:-moz-focusring,
+.c26[type='reset']:-moz-focusring,
+.c26[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c25 + button,
-.c25 + a {
+.c26 + button,
+.c26 + a {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c19 {
   position: relative;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
@@ -2459,16 +2483,16 @@ Array [
   max-width: 100%;
 }
 
-.c24 {
+.c25 {
   display: inline-block;
 }
 
-.c24 + button,
-.c24 + a {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
-.c23 {
+.c24 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2513,7 +2537,7 @@ Array [
   margin: 0;
 }
 
-.c23:focus {
+.c24:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2521,43 +2545,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c23:hover {
+.c24:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c23[disabled] {
+.c24[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c23:focus {
+.c24:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c24:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2603,7 +2627,7 @@ Array [
   margin: 0;
 }
 
-.c26:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2611,43 +2635,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c27:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2705,7 +2729,7 @@ Array [
   float: right;
 }
 
-.c28:focus {
+.c29:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2713,66 +2737,66 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c28:hover {
+.c29:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c28[disabled] {
+.c29[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c28:focus {
+.c29:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c28:hover {
+.c29:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c28:focus {
+.c29:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c28:hover {
+.c29:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c28 svg + span {
+.c29 svg + span {
   margin-left: 0.75rem;
 }
 
-.c28 svg {
+.c29 svg {
   max-height: 1.125rem;
 }
 
@@ -2791,6 +2815,22 @@ Array [
   font-size: 0.8125rem;
 }
 
+.c17 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -2810,7 +2850,7 @@ Array [
   margin-left: -0.625rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -2849,7 +2889,7 @@ Array [
   display: block;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -2859,7 +2899,7 @@ Array [
   display: block;
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -2869,7 +2909,7 @@ Array [
   display: block;
 }
 
-.c17 {
+.c18 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -2880,7 +2920,7 @@ Array [
   margin-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   margin-top: 0.375rem;
 }
 
@@ -3170,7 +3210,7 @@ Array [
   color: rgba(73,73,73,0.5);
 }
 
-.c19 {
+.c20 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 6rem;
@@ -3195,58 +3235,58 @@ Array [
   resize: vertical;
 }
 
-.c19:focus {
+.c20:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c19::-webkit-input-placeholder {
+.c20::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19::-moz-placeholder {
+.c20::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:-ms-input-placeholder {
+.c20:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:invalid {
+.c20:invalid {
   box-shadow: none;
 }
 
-.c19:disabled {
+.c20:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled {
+.c20:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
@@ -3272,7 +3312,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -3281,7 +3321,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -3308,7 +3348,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c22 {
+  .c23 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -3317,7 +3357,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c27 {
+  .c28 {
     -webkit-flex-basis: 41.66666666666667%;
     -ms-flex-preferred-size: 41.66666666666667%;
     flex-basis: 41.66666666666667%;
@@ -3404,12 +3444,16 @@ Array [
                                 >
                                     <div
                                         className="c16"
-                                    />
+                                    >
+                                        <label
+                                            className="c17"
+                                        />
+                                    </div>
                                 </div>
                             </div>
                         </div>
                         <div
-                            className="c17 c10"
+                            className="c18 c10"
                             height="0.75rem"
                         />
                     </div>
@@ -3437,7 +3481,7 @@ Array [
                                 className="c14"
                             >
                                 <textarea
-                                    className="c18 c19"
+                                    className="c19 c20"
                                     disabled={false}
                                     id="l"
                                     onBlur={undefined}
@@ -3448,26 +3492,30 @@ Array [
                             >
                                 <div
                                     className="c16"
-                                />
+                                >
+                                    <label
+                                        className="c17"
+                                    />
+                                </div>
                             </div>
                         </div>
                         <div
-                            className="c17 c10"
+                            className="c18 c10"
                             height="0.75rem"
                         />
                     </div>
                 </div>
                 <div
-                    className="c20"
+                    className="c21"
                 >
                     <div
-                        className="c21"
+                        className="c22"
                     >
                         <div
-                            className="c22"
+                            className="c23"
                         >
                             <button
-                                className="c23 c24 c25"
+                                className="c24 c25 c26"
                                 disabled={false}
                                 href=""
                                 onClick={[Function]}
@@ -3478,7 +3526,7 @@ Array [
                                 </span>
                             </button>
                             <button
-                                className="c26 c24 c25"
+                                className="c27 c25 c26"
                                 disabled={true}
                                 href=""
                                 type="submit"
@@ -3489,10 +3537,10 @@ Array [
                             </button>
                         </div>
                         <div
-                            className="c27"
+                            className="c28"
                         >
                             <button
-                                className="c28 c24 c25"
+                                className="c29 c25 c26"
                                 disabled={false}
                                 href=""
                                 icon={true}
@@ -3558,7 +3606,7 @@ Array [
     className="c0 c1"
     height="0.75rem"
 />,
-  .c25 {
+  .c26 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -3571,27 +3619,27 @@ Array [
   min-width: 7.5rem;
 }
 
-.c25::-moz-focus-inner,
-.c25[type='button']::-moz-focus-inner,
-.c25[type='reset']::-moz-focus-inner,
-.c25[type='submit']::-moz-focus-inner {
+.c26::-moz-focus-inner,
+.c26[type='button']::-moz-focus-inner,
+.c26[type='reset']::-moz-focus-inner,
+.c26[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c25:-moz-focusring,
-.c25[type='button']:-moz-focusring,
-.c25[type='reset']:-moz-focusring,
-.c25[type='submit']:-moz-focusring {
+.c26:-moz-focusring,
+.c26[type='button']:-moz-focusring,
+.c26[type='reset']:-moz-focusring,
+.c26[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c25 + button,
-.c25 + a {
+.c26 + button,
+.c26 + a {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c19 {
   position: relative;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
@@ -3604,16 +3652,16 @@ Array [
   max-width: 100%;
 }
 
-.c24 {
+.c25 {
   display: inline-block;
 }
 
-.c24 + button,
-.c24 + a {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
-.c23 {
+.c24 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3658,7 +3706,7 @@ Array [
   margin: 0;
 }
 
-.c23:focus {
+.c24:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3666,43 +3714,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c23:hover {
+.c24:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c23[disabled] {
+.c24[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c23:focus {
+.c24:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c24:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3748,7 +3796,7 @@ Array [
   margin: 0;
 }
 
-.c26:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3756,43 +3804,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c27:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3850,7 +3898,7 @@ Array [
   float: right;
 }
 
-.c28:focus {
+.c29:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3858,66 +3906,66 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c28:hover {
+.c29:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c28[disabled] {
+.c29[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c28:focus {
+.c29:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c28:hover {
+.c29:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c28:focus {
+.c29:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c28:hover {
+.c29:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c28 svg + span {
+.c29 svg + span {
   margin-left: 0.75rem;
 }
 
-.c28 svg {
+.c29 svg {
   max-height: 1.125rem;
 }
 
@@ -3936,6 +3984,22 @@ Array [
   font-size: 0.8125rem;
 }
 
+.c17 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -3955,7 +4019,7 @@ Array [
   margin-left: -0.625rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -3994,7 +4058,7 @@ Array [
   display: block;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4004,7 +4068,7 @@ Array [
   display: block;
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4014,7 +4078,7 @@ Array [
   display: block;
 }
 
-.c17 {
+.c18 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -4025,7 +4089,7 @@ Array [
   margin-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   margin-top: 0.375rem;
 }
 
@@ -4315,7 +4379,7 @@ Array [
   color: rgba(73,73,73,0.5);
 }
 
-.c19 {
+.c20 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 6rem;
@@ -4340,58 +4404,58 @@ Array [
   resize: vertical;
 }
 
-.c19:focus {
+.c20:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c19::-webkit-input-placeholder {
+.c20::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19::-moz-placeholder {
+.c20::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:-ms-input-placeholder {
+.c20:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:invalid {
+.c20:invalid {
   box-shadow: none;
 }
 
-.c19:disabled {
+.c20:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled {
+.c20:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
@@ -4417,7 +4481,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -4426,7 +4490,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -4453,7 +4517,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c22 {
+  .c23 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -4462,7 +4526,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c27 {
+  .c28 {
     -webkit-flex-basis: 41.66666666666667%;
     -ms-flex-preferred-size: 41.66666666666667%;
     flex-basis: 41.66666666666667%;
@@ -4549,12 +4613,16 @@ Array [
                                 >
                                     <div
                                         className="c16"
-                                    />
+                                    >
+                                        <label
+                                            className="c17"
+                                        />
+                                    </div>
                                 </div>
                             </div>
                         </div>
                         <div
-                            className="c17 c10"
+                            className="c18 c10"
                             height="0.75rem"
                         />
                     </div>
@@ -4582,7 +4650,7 @@ Array [
                                 className="c14"
                             >
                                 <textarea
-                                    className="c18 c19"
+                                    className="c19 c20"
                                     disabled={false}
                                     id="n"
                                     onBlur={undefined}
@@ -4593,26 +4661,30 @@ Array [
                             >
                                 <div
                                     className="c16"
-                                />
+                                >
+                                    <label
+                                        className="c17"
+                                    />
+                                </div>
                             </div>
                         </div>
                         <div
-                            className="c17 c10"
+                            className="c18 c10"
                             height="0.75rem"
                         />
                     </div>
                 </div>
                 <div
-                    className="c20"
+                    className="c21"
                 >
                     <div
-                        className="c21"
+                        className="c22"
                     >
                         <div
-                            className="c22"
+                            className="c23"
                         >
                             <button
-                                className="c23 c24 c25"
+                                className="c24 c25 c26"
                                 disabled={false}
                                 href=""
                                 onClick={[Function]}
@@ -4623,7 +4695,7 @@ Array [
                                 </span>
                             </button>
                             <button
-                                className="c26 c24 c25"
+                                className="c27 c25 c26"
                                 disabled={true}
                                 href=""
                                 type="submit"
@@ -4634,10 +4706,10 @@ Array [
                             </button>
                         </div>
                         <div
-                            className="c27"
+                            className="c28"
                         >
                             <button
-                                className="c28 c24 c25"
+                                className="c29 c25 c26"
                                 disabled={false}
                                 href=""
                                 icon={true}
@@ -4974,7 +5046,7 @@ Array [
         s
     </h3>
 </div>,
-  .c25 {
+  .c26 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -4987,27 +5059,27 @@ Array [
   min-width: 7.5rem;
 }
 
-.c25::-moz-focus-inner,
-.c25[type='button']::-moz-focus-inner,
-.c25[type='reset']::-moz-focus-inner,
-.c25[type='submit']::-moz-focus-inner {
+.c26::-moz-focus-inner,
+.c26[type='button']::-moz-focus-inner,
+.c26[type='reset']::-moz-focus-inner,
+.c26[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c25:-moz-focusring,
-.c25[type='button']:-moz-focusring,
-.c25[type='reset']:-moz-focusring,
-.c25[type='submit']:-moz-focusring {
+.c26:-moz-focusring,
+.c26[type='button']:-moz-focusring,
+.c26[type='reset']:-moz-focusring,
+.c26[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c25 + button,
-.c25 + a {
+.c26 + button,
+.c26 + a {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c19 {
   position: relative;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
@@ -5020,16 +5092,16 @@ Array [
   max-width: 100%;
 }
 
-.c24 {
+.c25 {
   display: inline-block;
 }
 
-.c24 + button,
-.c24 + a {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
-.c23 {
+.c24 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -5074,7 +5146,7 @@ Array [
   margin: 0;
 }
 
-.c23:focus {
+.c24:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -5082,43 +5154,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c23:hover {
+.c24:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c23[disabled] {
+.c24[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c23:focus {
+.c24:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c24:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -5164,7 +5236,7 @@ Array [
   margin: 0;
 }
 
-.c26:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -5172,43 +5244,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c27:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -5266,7 +5338,7 @@ Array [
   float: right;
 }
 
-.c28:focus {
+.c29:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -5274,66 +5346,66 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c28:hover {
+.c29:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c28[disabled] {
+.c29[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c28:focus {
+.c29:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c28:hover {
+.c29:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c28:focus {
+.c29:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c28:hover {
+.c29:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c28 svg + span {
+.c29 svg + span {
   margin-left: 0.75rem;
 }
 
-.c28 svg {
+.c29 svg {
   max-height: 1.125rem;
 }
 
@@ -5352,6 +5424,22 @@ Array [
   font-size: 0.8125rem;
 }
 
+.c17 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -5371,7 +5459,7 @@ Array [
   margin-left: -0.625rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -5410,7 +5498,7 @@ Array [
   display: block;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -5420,7 +5508,7 @@ Array [
   display: block;
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -5430,7 +5518,7 @@ Array [
   display: block;
 }
 
-.c17 {
+.c18 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -5441,7 +5529,7 @@ Array [
   margin-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   margin-top: 0.375rem;
 }
 
@@ -5731,7 +5819,7 @@ Array [
   color: rgba(73,73,73,0.5);
 }
 
-.c19 {
+.c20 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 6rem;
@@ -5756,58 +5844,58 @@ Array [
   resize: vertical;
 }
 
-.c19:focus {
+.c20:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c19::-webkit-input-placeholder {
+.c20::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19::-moz-placeholder {
+.c20::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:-ms-input-placeholder {
+.c20:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:invalid {
+.c20:invalid {
   box-shadow: none;
 }
 
-.c19:disabled {
+.c20:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled {
+.c20:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
@@ -5833,7 +5921,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -5842,7 +5930,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -5869,7 +5957,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c22 {
+  .c23 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -5878,7 +5966,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c27 {
+  .c28 {
     -webkit-flex-basis: 41.66666666666667%;
     -ms-flex-preferred-size: 41.66666666666667%;
     flex-basis: 41.66666666666667%;
@@ -5984,12 +6072,16 @@ Array [
                                 >
                                     <div
                                         className="c16"
-                                    />
+                                    >
+                                        <label
+                                            className="c17"
+                                        />
+                                    </div>
                                 </div>
                             </div>
                         </div>
                         <div
-                            className="c17 c10"
+                            className="c18 c10"
                             height="0.75rem"
                         />
                     </div>
@@ -6017,7 +6109,7 @@ Array [
                                 className="c14"
                             >
                                 <textarea
-                                    className="c18 c19"
+                                    className="c19 c20"
                                     disabled={false}
                                     id="p"
                                     onBlur={undefined}
@@ -6028,26 +6120,30 @@ Array [
                             >
                                 <div
                                     className="c16"
-                                />
+                                >
+                                    <label
+                                        className="c17"
+                                    />
+                                </div>
                             </div>
                         </div>
                         <div
-                            className="c17 c10"
+                            className="c18 c10"
                             height="0.75rem"
                         />
                     </div>
                 </div>
                 <div
-                    className="c20"
+                    className="c21"
                 >
                     <div
-                        className="c21"
+                        className="c22"
                     >
                         <div
-                            className="c22"
+                            className="c23"
                         >
                             <button
-                                className="c23 c24 c25"
+                                className="c24 c25 c26"
                                 disabled={false}
                                 href=""
                                 onClick={[Function]}
@@ -6058,7 +6154,7 @@ Array [
                                 </span>
                             </button>
                             <button
-                                className="c26 c24 c25"
+                                className="c27 c25 c26"
                                 disabled={true}
                                 href=""
                                 type="submit"
@@ -6069,10 +6165,10 @@ Array [
                             </button>
                         </div>
                         <div
-                            className="c27"
+                            className="c28"
                         >
                             <button
-                                className="c28 c24 c25"
+                                className="c29 c25 c26"
                                 disabled={false}
                                 href=""
                                 icon={true}
@@ -6138,7 +6234,7 @@ Array [
     className="c0 c1"
     height="0.75rem"
 />,
-  .c25 {
+  .c26 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -6151,27 +6247,27 @@ Array [
   min-width: 7.5rem;
 }
 
-.c25::-moz-focus-inner,
-.c25[type='button']::-moz-focus-inner,
-.c25[type='reset']::-moz-focus-inner,
-.c25[type='submit']::-moz-focus-inner {
+.c26::-moz-focus-inner,
+.c26[type='button']::-moz-focus-inner,
+.c26[type='reset']::-moz-focus-inner,
+.c26[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c25:-moz-focusring,
-.c25[type='button']:-moz-focusring,
-.c25[type='reset']:-moz-focusring,
-.c25[type='submit']:-moz-focusring {
+.c26:-moz-focusring,
+.c26[type='button']:-moz-focusring,
+.c26[type='reset']:-moz-focusring,
+.c26[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c25 + button,
-.c25 + a {
+.c26 + button,
+.c26 + a {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c19 {
   position: relative;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
@@ -6184,16 +6280,16 @@ Array [
   max-width: 100%;
 }
 
-.c24 {
+.c25 {
   display: inline-block;
 }
 
-.c24 + button,
-.c24 + a {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
-.c23 {
+.c24 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -6238,7 +6334,7 @@ Array [
   margin: 0;
 }
 
-.c23:focus {
+.c24:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -6246,43 +6342,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c23:hover {
+.c24:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c23[disabled] {
+.c24[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c23:focus {
+.c24:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c24:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -6328,7 +6424,7 @@ Array [
   margin: 0;
 }
 
-.c26:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -6336,43 +6432,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c27:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -6430,7 +6526,7 @@ Array [
   float: right;
 }
 
-.c28:focus {
+.c29:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -6438,66 +6534,66 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c28:hover {
+.c29:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c28[disabled] {
+.c29[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c28:focus {
+.c29:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c28:hover {
+.c29:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c28:focus {
+.c29:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c28:hover {
+.c29:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c28 svg + span {
+.c29 svg + span {
   margin-left: 0.75rem;
 }
 
-.c28 svg {
+.c29 svg {
   max-height: 1.125rem;
 }
 
@@ -6516,6 +6612,22 @@ Array [
   font-size: 0.8125rem;
 }
 
+.c17 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -6535,7 +6647,7 @@ Array [
   margin-left: -0.625rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -6574,7 +6686,7 @@ Array [
   display: block;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -6584,7 +6696,7 @@ Array [
   display: block;
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -6594,7 +6706,7 @@ Array [
   display: block;
 }
 
-.c17 {
+.c18 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -6605,7 +6717,7 @@ Array [
   margin-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   margin-top: 0.375rem;
 }
 
@@ -6895,7 +7007,7 @@ Array [
   color: rgba(73,73,73,0.5);
 }
 
-.c19 {
+.c20 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 6rem;
@@ -6920,58 +7032,58 @@ Array [
   resize: vertical;
 }
 
-.c19:focus {
+.c20:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c19::-webkit-input-placeholder {
+.c20::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19::-moz-placeholder {
+.c20::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:-ms-input-placeholder {
+.c20:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:invalid {
+.c20:invalid {
   box-shadow: none;
 }
 
-.c19:disabled {
+.c20:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c19:disabled {
+.c20:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-webkit-input-placeholder {
+.c20:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled::-moz-placeholder {
+.c20:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c19:disabled:-ms-input-placeholder {
+.c20:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
@@ -6997,7 +7109,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -7006,7 +7118,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -7033,7 +7145,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c22 {
+  .c23 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -7042,7 +7154,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c27 {
+  .c28 {
     -webkit-flex-basis: 41.66666666666667%;
     -ms-flex-preferred-size: 41.66666666666667%;
     flex-basis: 41.66666666666667%;
@@ -7148,12 +7260,16 @@ Array [
                                 >
                                     <div
                                         className="c16"
-                                    />
+                                    >
+                                        <label
+                                            className="c17"
+                                        />
+                                    </div>
                                 </div>
                             </div>
                         </div>
                         <div
-                            className="c17 c10"
+                            className="c18 c10"
                             height="0.75rem"
                         />
                     </div>
@@ -7181,7 +7297,7 @@ Array [
                                 className="c14"
                             >
                                 <textarea
-                                    className="c18 c19"
+                                    className="c19 c20"
                                     disabled={false}
                                     id="r"
                                     onBlur={undefined}
@@ -7192,26 +7308,30 @@ Array [
                             >
                                 <div
                                     className="c16"
-                                />
+                                >
+                                    <label
+                                        className="c17"
+                                    />
+                                </div>
                             </div>
                         </div>
                         <div
-                            className="c17 c10"
+                            className="c18 c10"
                             height="0.75rem"
                         />
                     </div>
                 </div>
                 <div
-                    className="c20"
+                    className="c21"
                 >
                     <div
-                        className="c21"
+                        className="c22"
                     >
                         <div
-                            className="c22"
+                            className="c23"
                         >
                             <button
-                                className="c23 c24 c25"
+                                className="c24 c25 c26"
                                 disabled={false}
                                 href=""
                                 onClick={[Function]}
@@ -7222,7 +7342,7 @@ Array [
                                 </span>
                             </button>
                             <button
-                                className="c26 c24 c25"
+                                className="c27 c25 c26"
                                 disabled={true}
                                 href=""
                                 type="submit"
@@ -7233,10 +7353,10 @@ Array [
                             </button>
                         </div>
                         <div
-                            className="c27"
+                            className="c28"
                         >
                             <button
-                                className="c28 c24 c25"
+                                className="c29 c25 c26"
                                 disabled={false}
                                 href=""
                                 icon={true}
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap
index 6e67a7ee..23e75e7d 100644
--- a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap
@@ -420,7 +420,7 @@ Array [
 <ul
     className="c0"
 />,
-  .c24 {
+  .c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -433,36 +433,36 @@ Array [
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
+.c25 + button,
+.c25 + a {
+  margin-left: 0.375rem;
+}
+
+.c24 {
+  display: inline-block;
+}
+
 .c24 + button,
 .c24 + a {
   margin-left: 0.375rem;
 }
 
 .c23 {
-  display: inline-block;
-}
-
-.c23 + button,
-.c23 + a {
-  margin-left: 0.375rem;
-}
-
-.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -507,7 +507,7 @@ Array [
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -515,43 +515,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -597,7 +597,7 @@ Array [
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -605,43 +605,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -699,7 +699,7 @@ Array [
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -707,66 +707,66 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -785,6 +785,22 @@ Array [
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c16 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -804,7 +820,7 @@ Array [
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -833,7 +849,7 @@ Array [
   display: block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -843,7 +859,7 @@ Array [
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -878,7 +894,7 @@ Array [
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -974,7 +990,7 @@ Array [
   flex-basis: auto;
 }
 
-.c18 {
+.c19 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -1249,7 +1265,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -1258,7 +1274,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -1276,7 +1292,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -1285,7 +1301,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     display: none;
   }
 }
@@ -1366,13 +1382,17 @@ Array [
                                 >
                                     <div
                                         className="c17"
-                                    />
+                                    >
+                                        <label
+                                            className="c18"
+                                        />
+                                    </div>
                                 </div>
                             </div>
                         </div>
                     </div>
                     <div
-                        className="c18"
+                        className="c19"
                     />
                     <div
                         className="c11"
@@ -1404,23 +1424,27 @@ Array [
                                 >
                                     <div
                                         className="c17"
-                                    />
+                                    >
+                                        <label
+                                            className="c18"
+                                        />
+                                    </div>
                                 </div>
                             </div>
                         </div>
                     </div>
                 </div>
                 <div
-                    className="c19"
+                    className="c20"
                 >
                     <div
-                        className="c20"
+                        className="c21"
                     >
                         <div
-                            className="c21"
+                            className="c22"
                         >
                             <button
-                                className="c22 c23 c24"
+                                className="c23 c24 c25"
                                 disabled={false}
                                 href=""
                                 onClick={[Function]}
@@ -1431,7 +1455,7 @@ Array [
                                 </span>
                             </button>
                             <button
-                                className="c25 c23 c24"
+                                className="c26 c24 c25"
                                 disabled={true}
                                 href=""
                                 type="submit"
@@ -1442,10 +1466,10 @@ Array [
                             </button>
                         </div>
                         <div
-                            className="c26"
+                            className="c27"
                         >
                             <button
-                                className="c27 c23 c24"
+                                className="c28 c24 c25"
                                 disabled={false}
                                 href=""
                                 icon={true}
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/user-script.spec.js.snap b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/user-script.spec.js.snap
index 4b14aacb..b4504e7f 100644
--- a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/user-script.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/user-script.spec.js.snap
@@ -142,7 +142,7 @@ Array [
         />
     </div>
 </div>,
-  .c23 {
+  .c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -155,23 +155,23 @@ Array [
   min-width: 7.5rem;
 }
 
-.c23::-moz-focus-inner,
-.c23[type='button']::-moz-focus-inner,
-.c23[type='reset']::-moz-focus-inner,
-.c23[type='submit']::-moz-focus-inner {
+.c24::-moz-focus-inner,
+.c24[type='button']::-moz-focus-inner,
+.c24[type='reset']::-moz-focus-inner,
+.c24[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c23:-moz-focusring,
-.c23[type='button']:-moz-focusring,
-.c23[type='reset']:-moz-focusring,
-.c23[type='submit']:-moz-focusring {
+.c24:-moz-focusring,
+.c24[type='button']:-moz-focusring,
+.c24[type='reset']:-moz-focusring,
+.c24[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button,
-.c23 + a {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
@@ -188,16 +188,16 @@ Array [
   max-width: 100%;
 }
 
-.c22 {
+.c23 {
   display: inline-block;
 }
 
-.c22 + button,
-.c22 + a {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -242,7 +242,7 @@ Array [
   margin: 0;
 }
 
-.c21:focus {
+.c22:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -250,43 +250,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c21:hover {
+.c22:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c21[disabled] {
+.c22[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c21:focus {
+.c22:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c21:hover {
+.c22:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c24 {
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -332,7 +332,7 @@ Array [
   margin: 0;
 }
 
-.c24:focus {
+.c25:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -340,43 +340,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c24[disabled] {
+.c25[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c24:focus {
+.c25:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -434,7 +434,7 @@ Array [
   float: right;
 }
 
-.c26:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -442,66 +442,66 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c27:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26:focus {
+.c27:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:hover {
+.c27:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c26 svg + span {
+.c27 svg + span {
   margin-left: 0.75rem;
 }
 
-.c26 svg {
+.c27 svg {
   max-height: 1.125rem;
 }
 
@@ -520,6 +520,22 @@ Array [
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -539,7 +555,7 @@ Array [
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -578,7 +594,7 @@ Array [
   display: block;
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -609,7 +625,7 @@ Array [
   margin-top: 0.75rem;
 }
 
-.c18 {
+.c19 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -620,7 +636,7 @@ Array [
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -940,7 +956,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -949,7 +965,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -976,7 +992,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c25 {
+  .c26 {
     display: none;
   }
 }
@@ -1056,26 +1072,30 @@ Array [
                             >
                                 <div
                                     className="c17"
-                                />
+                                >
+                                    <label
+                                        className="c18"
+                                    />
+                                </div>
                             </div>
                         </div>
                         <div
-                            className="c18 c10"
+                            className="c19 c10"
                             height="0.75rem"
                         />
                     </div>
                 </div>
                 <div
-                    className="c19"
+                    className="c20"
                 >
                     <div
-                        className="c20"
+                        className="c21"
                     >
                         <div
                             className="c11"
                         >
                             <button
-                                className="c21 c22 c23"
+                                className="c22 c23 c24"
                                 disabled={false}
                                 href=""
                                 onClick={[Function]}
@@ -1086,7 +1106,7 @@ Array [
                                 </span>
                             </button>
                             <button
-                                className="c24 c22 c23"
+                                className="c25 c23 c24"
                                 disabled={true}
                                 href=""
                                 type="submit"
@@ -1097,10 +1117,10 @@ Array [
                             </button>
                         </div>
                         <div
-                            className="c25"
+                            className="c26"
                         >
                             <button
-                                className="c26 c22 c23"
+                                className="c27 c23 c24"
                                 disabled={false}
                                 href=""
                                 icon={true}
@@ -1356,7 +1376,7 @@ Array [
         </div>
     </div>
 </div>,
-  .c23 {
+  .c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -1369,23 +1389,23 @@ Array [
   min-width: 7.5rem;
 }
 
-.c23::-moz-focus-inner,
-.c23[type='button']::-moz-focus-inner,
-.c23[type='reset']::-moz-focus-inner,
-.c23[type='submit']::-moz-focus-inner {
+.c24::-moz-focus-inner,
+.c24[type='button']::-moz-focus-inner,
+.c24[type='reset']::-moz-focus-inner,
+.c24[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c23:-moz-focusring,
-.c23[type='button']:-moz-focusring,
-.c23[type='reset']:-moz-focusring,
-.c23[type='submit']:-moz-focusring {
+.c24:-moz-focusring,
+.c24[type='button']:-moz-focusring,
+.c24[type='reset']:-moz-focusring,
+.c24[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button,
-.c23 + a {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
@@ -1402,16 +1422,16 @@ Array [
   max-width: 100%;
 }
 
-.c22 {
+.c23 {
   display: inline-block;
 }
 
-.c22 + button,
-.c22 + a {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1456,7 +1476,7 @@ Array [
   margin: 0;
 }
 
-.c21:focus {
+.c22:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1464,43 +1484,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c21:hover {
+.c22:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c21[disabled] {
+.c22[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c21:focus {
+.c22:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c21:hover {
+.c22:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c24 {
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1546,7 +1566,7 @@ Array [
   margin: 0;
 }
 
-.c24:focus {
+.c25:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1554,43 +1574,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c24[disabled] {
+.c25[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c24:focus {
+.c25:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1648,7 +1668,7 @@ Array [
   float: right;
 }
 
-.c26:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1656,66 +1676,66 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c27:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26:focus {
+.c27:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:hover {
+.c27:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c26 svg + span {
+.c27 svg + span {
   margin-left: 0.75rem;
 }
 
-.c26 svg {
+.c27 svg {
   max-height: 1.125rem;
 }
 
@@ -1734,6 +1754,22 @@ Array [
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -1753,7 +1789,7 @@ Array [
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1792,7 +1828,7 @@ Array [
   display: block;
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1823,7 +1859,7 @@ Array [
   margin-top: 0.75rem;
 }
 
-.c18 {
+.c19 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -1834,7 +1870,7 @@ Array [
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -2154,7 +2190,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -2163,7 +2199,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -2190,7 +2226,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c25 {
+  .c26 {
     display: none;
   }
 }
@@ -2270,26 +2306,30 @@ Array [
                             >
                                 <div
                                     className="c17"
-                                />
+                                >
+                                    <label
+                                        className="c18"
+                                    />
+                                </div>
                             </div>
                         </div>
                         <div
-                            className="c18 c10"
+                            className="c19 c10"
                             height="0.75rem"
                         />
                     </div>
                 </div>
                 <div
-                    className="c19"
+                    className="c20"
                 >
                     <div
-                        className="c20"
+                        className="c21"
                     >
                         <div
                             className="c11"
                         >
                             <button
-                                className="c21 c22 c23"
+                                className="c22 c23 c24"
                                 disabled={false}
                                 href=""
                                 onClick={[Function]}
@@ -2300,7 +2340,7 @@ Array [
                                 </span>
                             </button>
                             <button
-                                className="c24 c22 c23"
+                                className="c25 c23 c24"
                                 disabled={true}
                                 href=""
                                 type="submit"
@@ -2311,10 +2351,10 @@ Array [
                             </button>
                         </div>
                         <div
-                            className="c25"
+                            className="c26"
                         >
                             <button
-                                className="c26 c22 c23"
+                                className="c27 c23 c24"
                                 disabled={false}
                                 href=""
                                 icon={true}
@@ -3234,7 +3274,7 @@ Array [
         </div>
     </div>
 </div>,
-  .c23 {
+  .c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -3247,23 +3287,23 @@ Array [
   min-width: 7.5rem;
 }
 
-.c23::-moz-focus-inner,
-.c23[type='button']::-moz-focus-inner,
-.c23[type='reset']::-moz-focus-inner,
-.c23[type='submit']::-moz-focus-inner {
+.c24::-moz-focus-inner,
+.c24[type='button']::-moz-focus-inner,
+.c24[type='reset']::-moz-focus-inner,
+.c24[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c23:-moz-focusring,
-.c23[type='button']:-moz-focusring,
-.c23[type='reset']:-moz-focusring,
-.c23[type='submit']:-moz-focusring {
+.c24:-moz-focusring,
+.c24[type='button']:-moz-focusring,
+.c24[type='reset']:-moz-focusring,
+.c24[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button,
-.c23 + a {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
@@ -3280,16 +3320,16 @@ Array [
   max-width: 100%;
 }
 
-.c22 {
+.c23 {
   display: inline-block;
 }
 
-.c22 + button,
-.c22 + a {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3334,7 +3374,7 @@ Array [
   margin: 0;
 }
 
-.c21:focus {
+.c22:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3342,43 +3382,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c21:hover {
+.c22:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c21[disabled] {
+.c22[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c21:focus {
+.c22:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c21:hover {
+.c22:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c24 {
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3424,7 +3464,7 @@ Array [
   margin: 0;
 }
 
-.c24:focus {
+.c25:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3432,43 +3472,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c24[disabled] {
+.c25[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c24:focus {
+.c25:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3526,7 +3566,7 @@ Array [
   float: right;
 }
 
-.c26:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3534,66 +3574,66 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c27:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c27:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26:focus {
+.c27:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:hover {
+.c27:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c26 svg + span {
+.c27 svg + span {
   margin-left: 0.75rem;
 }
 
-.c26 svg {
+.c27 svg {
   max-height: 1.125rem;
 }
 
@@ -3612,6 +3652,22 @@ Array [
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -3631,7 +3687,7 @@ Array [
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -3670,7 +3726,7 @@ Array [
   display: block;
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -3701,7 +3757,7 @@ Array [
   margin-top: 0.75rem;
 }
 
-.c18 {
+.c19 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -3712,7 +3768,7 @@ Array [
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -4032,7 +4088,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -4041,7 +4097,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -4068,7 +4124,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c25 {
+  .c26 {
     display: none;
   }
 }
@@ -4148,26 +4204,30 @@ Array [
                             >
                                 <div
                                     className="c17"
-                                />
+                                >
+                                    <label
+                                        className="c18"
+                                    />
+                                </div>
                             </div>
                         </div>
                         <div
-                            className="c18 c10"
+                            className="c19 c10"
                             height="0.75rem"
                         />
                     </div>
                 </div>
                 <div
-                    className="c19"
+                    className="c20"
                 >
                     <div
-                        className="c20"
+                        className="c21"
                     >
                         <div
                             className="c11"
                         >
                             <button
-                                className="c21 c22 c23"
+                                className="c22 c23 c24"
                                 disabled={false}
                                 href=""
                                 onClick={[Function]}
@@ -4178,7 +4238,7 @@ Array [
                                 </span>
                             </button>
                             <button
-                                className="c24 c22 c23"
+                                className="c25 c23 c24"
                                 disabled={true}
                                 href=""
                                 type="submit"
@@ -4189,10 +4249,10 @@ Array [
                             </button>
                         </div>
                         <div
-                            className="c25"
+                            className="c26"
                         >
                             <button
-                                className="c26 c22 c23"
+                                className="c27 c23 c24"
                                 disabled={false}
                                 href=""
                                 icon={true}
@@ -4574,7 +4634,7 @@ Array [
         </div>
     </div>
 </div>,
-  .c24 {
+  .c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -4587,23 +4647,23 @@ Array [
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button,
-.c24 + a {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
@@ -4620,16 +4680,16 @@ Array [
   max-width: 100%;
 }
 
-.c23 {
+.c24 {
   display: inline-block;
 }
 
-.c23 + button,
-.c23 + a {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4674,7 +4734,7 @@ Array [
   margin: 0;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4682,43 +4742,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c22:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4764,7 +4824,7 @@ Array [
   margin: 0;
 }
 
-.c25:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4772,43 +4832,43 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4866,7 +4926,7 @@ Array [
   float: right;
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4874,66 +4934,66 @@ Array [
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -4952,6 +5012,22 @@ Array [
   font-size: 0.8125rem;
 }
 
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -4971,7 +5047,7 @@ Array [
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -5010,7 +5086,7 @@ Array [
   display: block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -5020,7 +5096,7 @@ Array [
   display: block;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -5030,7 +5106,7 @@ Array [
   display: block;
 }
 
-.c18 {
+.c19 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -5041,7 +5117,7 @@ Array [
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -5372,7 +5448,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -5381,7 +5457,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -5408,7 +5484,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -5417,7 +5493,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     -webkit-flex-basis: 41.66666666666667%;
     -ms-flex-preferred-size: 41.66666666666667%;
     flex-basis: 41.66666666666667%;
@@ -5517,26 +5593,30 @@ Array [
                             >
                                 <div
                                     className="c17"
-                                />
+                                >
+                                    <label
+                                        className="c18"
+                                    />
+                                </div>
                             </div>
                         </div>
                         <div
-                            className="c18 c10"
+                            className="c19 c10"
                             height="0.75rem"
                         />
                     </div>
                 </div>
                 <div
-                    className="c19"
+                    className="c20"
                 >
                     <div
-                        className="c20"
+                        className="c21"
                     >
                         <div
-                            className="c21"
+                            className="c22"
                         >
                             <button
-                                className="c22 c23 c24"
+                                className="c23 c24 c25"
                                 disabled={false}
                                 href=""
                                 onClick={[Function]}
@@ -5547,7 +5627,7 @@ Array [
                                 </span>
                             </button>
                             <button
-                                className="c25 c23 c24"
+                                className="c26 c24 c25"
                                 disabled={true}
                                 href=""
                                 type="submit"
@@ -5558,10 +5638,10 @@ Array [
                             </button>
                         </div>
                         <div
-                            className="c26"
+                            className="c27"
                         >
                             <button
-                                className="c27 c23 c24"
+                                className="c28 c24 c25"
                                 disabled={false}
                                 href=""
                                 icon={true}
@@ -5942,6 +6022,1320 @@ Array [
             </p>
         </div>
     </div>
+</div>,
+  .c25 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c25 + button,
+.c25 + a {
+  margin-left: 0.375rem;
+}
+
+.c15 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+  max-width: 100%;
+}
+
+.c24 {
+  display: inline-block;
+}
+
+.c24 + button,
+.c24 + a {
+  margin-left: 0.375rem;
+}
+
+.c23 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  margin: 0;
+}
+
+.c23:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c23:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c23[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c23:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c23:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c26 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  margin: 0;
+}
+
+.c26:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c26:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c26[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c26:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c26:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c28 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  margin: 0;
+  float: right;
+}
+
+.c28:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c28:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c28[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c28:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c28:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c28:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c28:hover {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c28 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c28 svg {
+  max-height: 1.125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  margin-right: 0.75rem;
+  font-weight: 600;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c18 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
+.c10 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.625rem;
+  margin-left: -0.625rem;
+}
+
+.c21 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.625rem;
+  margin-left: -0.625rem;
+}
+
+.c11 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c17 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c22 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c27 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c19 {
+  background-color: rgb(216,216,216);
+  margin: 0;
+  background-color: transparent;
+  height: 0.75rem;
+}
+
+.c14 {
+  margin-top: 0.1875rem;
+}
+
+.c20 {
+  margin-top: 0.375rem;
+}
+
+.c3 {
+  padding-right: 1.125rem;
+  padding-left: 1.125rem;
+}
+
+.c9 {
+  padding: 1.125rem;
+}
+
+.c4 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  -webkit-flex-basis: 100%;
+  -ms-flex-preferred-size: 100%;
+  flex-basis: 100%;
+}
+
+.c0 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
+}
+
+.c8 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c8 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c8 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
+.c1 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: pointer;
+  min-height: auto;
+  height: 2.875rem;
+  -webkit-flex: 0 0 2.875rem;
+  -ms-flex: 0 0 2.875rem;
+  flex: 0 0 2.875rem;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  z-index: 1;
+  line-height: 1.5rem;
+  height: auto;
+  max-width: 100%;
+  margin: -0.0625rem -0.0625rem 0 -0.0625rem;
+}
+
+.c1 button {
+  margin-bottom: 0;
+  margin-top: 0;
+}
+
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: pointer;
+  min-height: auto;
+  height: 2.875rem;
+  -webkit-flex: 0 0 2.875rem;
+  -ms-flex: 0 0 2.875rem;
+  flex: 0 0 2.875rem;
+  box-sizing: border-box;
+  min-height: 2.9375rem;
+  max-width: 100%;
+  width: auto;
+  height: auto;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: stretch;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  overflow: hidden;
+  background-color: transparent;
+  border-width: 0;
+  box-shadow: none;
+  color: inherit;
+}
+
+.c12 {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  height: auto;
+  -webkit-margin-start: 0;
+  -webkit-margin-end: 0;
+  -webkit-padding-before: 0;
+  -webkit-padding-start: 0;
+  -webkit-padding-end: 0;
+  -webkit-padding-after: 0;
+  width: 100%;
+}
+
+.c16 {
+  box-sizing: border-box;
+  width: 18.75rem;
+  height: 6rem;
+  min-height: 6rem;
+  padding: 0.8125rem 0.75rem;
+  border-radius: 0.25rem;
+  background-color: rgb(255,255,255);
+  border: 0.0625rem solid rgb(216,216,216);
+  color: rgba(73,73,73,1);
+  font-size: 0.9375rem;
+  line-height: normal !important;
+  font-style: normal;
+  font-stretch: normal;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  outline: 0;
+  font-family: "Roboto Mono",monospace;
+  width: 100%;
+  min-width: 100%;
+  text-overflow: ellipsis;
+  resize: vertical;
+}
+
+.c16:focus {
+  border-color: rgb(59,70,204);
+  outline: 0;
+}
+
+.c16::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c16::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c16:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c16:invalid {
+  box-shadow: none;
+}
+
+.c16:disabled {
+  background-color: rgb(250,250,250);
+  color: rgb(216,216,216);
+  cursor: not-allowed;
+}
+
+.c16:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c16:disabled::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c16:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c16:disabled {
+  color: rgba(73,73,73,1);
+}
+
+.c16:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c16:disabled::-moz-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c16:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c7 {
+  word-break: break-all;
+  line-height: 1.5;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: block;
+}
+
+.c2 {
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.c5 {
+  height: 2.9375rem;
+  max-width: 98%;
+}
+
+@media only screen and (min-width:0em) {
+  .c21 {
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c21 {
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c11 {
+    -webkit-flex-basis: 100%;
+    -ms-flex-preferred-size: 100%;
+    flex-basis: 100%;
+    max-width: 100%;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c17 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c22 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c27 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+  }
+}
+
+<form
+    onSubmit={undefined}
+>
+    <div
+        className="c0"
+        disabled={false}
+        name="card"
+    >
+        <div
+            className="c1"
+            disabled={false}
+            name="card-header"
+            onClick={[Function]}
+        >
+            <div
+                className="c2 c3"
+            >
+                <div
+                    className="c4"
+                >
+                    <div
+                        className="c5 c6"
+                        disabled={false}
+                        name="card-header-meta"
+                    >
+                        <div
+                            className="c7"
+                        />
+                    </div>
+                    <svg
+                        className=""
+                        height="6"
+                        innerRef={undefined}
+                        onClick={[Function]}
+                        style={
+                            Object {
+                                "transform": "rotate(180deg)",
+                              }
+                        }
+                        viewBox="0 0 9.6 6"
+                        width="9.6"
+                        xmlns="http://www.w3.org/2000/svg"
+                    >
+                        <path
+                            d="M9.6,1.12,8.24,0,4.8,3.5,1.36,0,0,1.12,4.8,6Z"
+                            fill="rgba(73, 73, 73, 1)"
+                        />
+                    </svg>
+                </div>
+            </div>
+        </div>
+        <div
+            className="c8"
+            name="card-outlet"
+        >
+            <div
+                className="c9"
+            >
+                <div
+                    className="c10"
+                >
+                    <div
+                        className="c11"
+                    >
+                        <div
+                            className="baseline-jVaZNU kXgQxt c12"
+                            name="value"
+                            role="group"
+                            style={undefined}
+                        >
+                            <label
+                                className="c13"
+                                htmlFor="p"
+                            >
+                                User Script
+                                 value
+                            </label>
+                            <div
+                                className="c14"
+                            >
+                                <textarea
+                                    className="c15 c16"
+                                    disabled={false}
+                                    id="p"
+                                    onBlur={undefined}
+                                />
+                            </div>
+                            <div
+                                className="c10"
+                            >
+                                <div
+                                    className="c17"
+                                >
+                                    <label
+                                        className="c18"
+                                    />
+                                </div>
+                            </div>
+                        </div>
+                        <div
+                            className="c19 c10"
+                            height="0.75rem"
+                        />
+                    </div>
+                </div>
+                <div
+                    className="c20"
+                >
+                    <div
+                        className="c21"
+                    >
+                        <div
+                            className="c22"
+                        >
+                            <button
+                                className="c23 c24 c25"
+                                disabled={false}
+                                href=""
+                                onClick={[Function]}
+                                type="button"
+                            >
+                                <span>
+                                    Cancel
+                                </span>
+                            </button>
+                            <button
+                                className="c26 c24 c25"
+                                disabled={true}
+                                href=""
+                                type="submit"
+                            >
+                                <span>
+                                    Save
+                                </span>
+                            </button>
+                        </div>
+                        <div
+                            className="c27"
+                        >
+                            <button
+                                className="c28 c24 c25"
+                                disabled={false}
+                                href=""
+                                icon={true}
+                                onClick={[Function]}
+                                type="button"
+                            >
+                                <svg
+                                    className=""
+                                    height="16"
+                                    innerRef={undefined}
+                                    style={
+                                        Object {
+                                            "transform": "rotate(0deg)",
+                                          }
+                                    }
+                                    viewBox="0 0 12 16"
+                                    width="12"
+                                    xmlns="http://www.w3.org/2000/svg"
+                                >
+                                    <path
+                                        d="M2.67,0V1.5H0V3H12V1.5H9.33V0ZM0,4,1.33,16h9.34L12,4ZM8,5h2.51l-1,10H8ZM1.49,5H4V15H2.53ZM7,15H5V5H7Z"
+                                        fill="rgb(210, 67, 58)"
+                                    />
+                                </svg>
+                                <span>
+                                    Remove
+                                </span>
+                            </button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</form>,
+  .c3 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c3::-moz-focus-inner,
+.c3[type='button']::-moz-focus-inner,
+.c3[type='reset']::-moz-focus-inner,
+.c3[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c3:-moz-focusring,
+.c3[type='button']:-moz-focusring,
+.c3[type='reset']:-moz-focusring,
+.c3[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c3 + button,
+.c3 + a {
+  margin-left: 0.375rem;
+}
+
+.c2 {
+  display: inline-block;
+}
+
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c1:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c1:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c1:active,
+.c1:active:hover,
+.c1:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c1[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c0 {
+  margin-top: 1.5rem;
+  margin-bottom: 2.625rem;
+}
+
+<div
+    className="c0"
+>
+    <button
+        className="c1 c2 c3"
+        href=""
+        onClick={undefined}
+        type="submit"
+    >
+        Next
+    </button>
+</div>,
+]
+`;
+
+exports[`renders <UserScript proceeded /> without throwing 1`] = `
+Array [
+  .c3 {
+  font-size: 80%;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  color: rgba(73,73,73,1);
+  line-height: 1.125rem;
+  font-size: 0.8125rem;
+}
+
+.c6 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.625rem;
+  margin-left: -0.625rem;
+}
+
+.c5 {
+  background-color: rgb(216,216,216);
+  margin: 0;
+  height: 0.0625rem;
+}
+
+.c1 {
+  margin-right: 0.375rem;
+}
+
+.c4 {
+  margin-top: 0.375rem;
+  margin-bottom: 1.125rem;
+}
+
+.c0 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+}
+
+.c2 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  -webkit-flex-basis: 100%;
+  -ms-flex-preferred-size: 100%;
+  flex-basis: 100%;
+}
+
+<div
+    className=""
+    id={undefined}
+    onClick={false}
+>
+    <div
+        className="c0"
+    >
+        <div
+            className="c1"
+        >
+            <div
+                className="c2"
+            >
+                <svg
+                    className=""
+                    height="18"
+                    innerRef={undefined}
+                    style={
+                        Object {
+                            "transform": "rotate(0deg)",
+                          }
+                    }
+                    viewBox="0 0 15.43 18"
+                    width="15.43"
+                    xmlns="http://www.w3.org/2000/svg"
+                >
+                    <path
+                        d="M15.09,13.64,12.29,6h.14a3,3,0,0,0,0-6H3A3,3,0,0,0,0,3a3.37,3.37,0,0,0,.09.71,6.85,6.85,0,0,0,.25.64l3,7.68L3,12a3,3,0,0,0,0,6h9.43a2.94,2.94,0,0,0,3-3.43A7.54,7.54,0,0,0,15.09,13.64ZM12.43,1.46a1.54,1.54,0,1,1,0,3.08,1.52,1.52,0,0,1-1.27-.67l-.24-.6a1.24,1.24,0,0,1,0-.27A1.54,1.54,0,0,1,12.43,1.46ZM2,3.74l-.21-.52a.78.78,0,0,1,0-.22A1.29,1.29,0,0,1,3,1.71H9.73A3,3,0,0,0,9.43,3a2.76,2.76,0,0,0,.09.71L9.63,4c0,.09.77,2,.77,2l2.33,6-.3,0H5.36L2.88,6ZM9.73,16.29H3a1.29,1.29,0,0,1,0-2.58H9.73a2.92,2.92,0,0,0,0,2.58Zm2.7.25A1.54,1.54,0,1,1,14,15,1.54,1.54,0,0,1,12.43,16.54Z"
+                        fill="rgba(73, 73, 73, 1)"
+                    />
+                </svg>
+            </div>
+        </div>
+        <small
+            className="c3"
+        >
+            User Script
+        </small>
+    </div>
+    <div
+        className="c4"
+    >
+        <div
+            className="c5 c6"
+            height="0.0625rem"
+        />
+    </div>
 </div>,
   .c24 {
   font-family: sans-serif;
@@ -6321,1286 +7715,7 @@ Array [
   font-size: 0.8125rem;
 }
 
-.c10 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.625rem;
-  margin-left: -0.625rem;
-}
-
-.c20 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.625rem;
-  margin-left: -0.625rem;
-}
-
-.c11 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
-.c17 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
-.c21 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
-.c26 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
 .c18 {
-  background-color: rgb(216,216,216);
-  margin: 0;
-  background-color: transparent;
-  height: 0.75rem;
-}
-
-.c14 {
-  margin-top: 0.1875rem;
-}
-
-.c19 {
-  margin-top: 0.375rem;
-}
-
-.c3 {
-  padding-right: 1.125rem;
-  padding-left: 1.125rem;
-}
-
-.c9 {
-  padding: 1.125rem;
-}
-
-.c4 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-  -webkit-flex-basis: 100%;
-  -ms-flex-preferred-size: 100%;
-  flex-basis: 100%;
-}
-
-.c0 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
-}
-
-.c8 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c8 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c8 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
-.c1 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: pointer;
-  min-height: auto;
-  height: 2.875rem;
-  -webkit-flex: 0 0 2.875rem;
-  -ms-flex: 0 0 2.875rem;
-  flex: 0 0 2.875rem;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  z-index: 1;
-  line-height: 1.5rem;
-  height: auto;
-  max-width: 100%;
-  margin: -0.0625rem -0.0625rem 0 -0.0625rem;
-}
-
-.c1 button {
-  margin-bottom: 0;
-  margin-top: 0;
-}
-
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: pointer;
-  min-height: auto;
-  height: 2.875rem;
-  -webkit-flex: 0 0 2.875rem;
-  -ms-flex: 0 0 2.875rem;
-  flex: 0 0 2.875rem;
-  box-sizing: border-box;
-  min-height: 2.9375rem;
-  max-width: 100%;
-  width: auto;
-  height: auto;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: stretch;
-  -webkit-box-align: stretch;
-  -ms-flex-align: stretch;
-  align-items: stretch;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  overflow: hidden;
-  background-color: transparent;
-  border-width: 0;
-  box-shadow: none;
-  color: inherit;
-}
-
-.c12 {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  border: none;
-  overflow: hidden;
-  height: auto;
-  -webkit-margin-start: 0;
-  -webkit-margin-end: 0;
-  -webkit-padding-before: 0;
-  -webkit-padding-start: 0;
-  -webkit-padding-end: 0;
-  -webkit-padding-after: 0;
-  width: 100%;
-}
-
-.c16 {
-  box-sizing: border-box;
-  width: 18.75rem;
-  height: 6rem;
-  min-height: 6rem;
-  padding: 0.8125rem 0.75rem;
-  border-radius: 0.25rem;
-  background-color: rgb(255,255,255);
-  border: 0.0625rem solid rgb(216,216,216);
-  color: rgba(73,73,73,1);
-  font-size: 0.9375rem;
-  line-height: normal !important;
-  font-style: normal;
-  font-stretch: normal;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  outline: 0;
-  font-family: "Roboto Mono",monospace;
-  width: 100%;
-  min-width: 100%;
-  text-overflow: ellipsis;
-  resize: vertical;
-}
-
-.c16:focus {
-  border-color: rgb(59,70,204);
-  outline: 0;
-}
-
-.c16::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c16::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c16:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c16:invalid {
-  box-shadow: none;
-}
-
-.c16:disabled {
-  background-color: rgb(250,250,250);
-  color: rgb(216,216,216);
-  cursor: not-allowed;
-}
-
-.c16:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c16:disabled::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c16:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c16:disabled {
-  color: rgba(73,73,73,1);
-}
-
-.c16:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c16:disabled::-moz-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c16:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c7 {
-  word-break: break-all;
-  line-height: 1.5;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  display: block;
-}
-
-.c2 {
-  word-wrap: break-word;
-  overflow-wrap: break-word;
-  width: 100%;
-  box-sizing: border-box;
-}
-
-.c5 {
-  height: 2.9375rem;
-  max-width: 98%;
-}
-
-@media only screen and (min-width:0em) {
-  .c20 {
-    -webkit-align-items: center;
-    -webkit-box-align: center;
-    -ms-flex-align: center;
-    align-items: center;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c20 {
-    -webkit-box-pack: justify;
-    -webkit-justify-content: space-between;
-    -ms-flex-pack: justify;
-    justify-content: space-between;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c11 {
-    -webkit-flex-basis: 100%;
-    -ms-flex-preferred-size: 100%;
-    flex-basis: 100%;
-    max-width: 100%;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c17 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c21 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c26 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-  }
-}
-
-<form
-    onSubmit={undefined}
->
-    <div
-        className="c0"
-        disabled={false}
-        name="card"
-    >
-        <div
-            className="c1"
-            disabled={false}
-            name="card-header"
-            onClick={[Function]}
-        >
-            <div
-                className="c2 c3"
-            >
-                <div
-                    className="c4"
-                >
-                    <div
-                        className="c5 c6"
-                        disabled={false}
-                        name="card-header-meta"
-                    >
-                        <div
-                            className="c7"
-                        />
-                    </div>
-                    <svg
-                        className=""
-                        height="6"
-                        innerRef={undefined}
-                        onClick={[Function]}
-                        style={
-                            Object {
-                                "transform": "rotate(180deg)",
-                              }
-                        }
-                        viewBox="0 0 9.6 6"
-                        width="9.6"
-                        xmlns="http://www.w3.org/2000/svg"
-                    >
-                        <path
-                            d="M9.6,1.12,8.24,0,4.8,3.5,1.36,0,0,1.12,4.8,6Z"
-                            fill="rgba(73, 73, 73, 1)"
-                        />
-                    </svg>
-                </div>
-            </div>
-        </div>
-        <div
-            className="c8"
-            name="card-outlet"
-        >
-            <div
-                className="c9"
-            >
-                <div
-                    className="c10"
-                >
-                    <div
-                        className="c11"
-                    >
-                        <div
-                            className="baseline-jVaZNU kXgQxt c12"
-                            name="value"
-                            role="group"
-                            style={undefined}
-                        >
-                            <label
-                                className="c13"
-                                htmlFor="p"
-                            >
-                                User Script
-                                 value
-                            </label>
-                            <div
-                                className="c14"
-                            >
-                                <textarea
-                                    className="c15 c16"
-                                    disabled={false}
-                                    id="p"
-                                    onBlur={undefined}
-                                />
-                            </div>
-                            <div
-                                className="c10"
-                            >
-                                <div
-                                    className="c17"
-                                />
-                            </div>
-                        </div>
-                        <div
-                            className="c18 c10"
-                            height="0.75rem"
-                        />
-                    </div>
-                </div>
-                <div
-                    className="c19"
-                >
-                    <div
-                        className="c20"
-                    >
-                        <div
-                            className="c21"
-                        >
-                            <button
-                                className="c22 c23 c24"
-                                disabled={false}
-                                href=""
-                                onClick={[Function]}
-                                type="button"
-                            >
-                                <span>
-                                    Cancel
-                                </span>
-                            </button>
-                            <button
-                                className="c25 c23 c24"
-                                disabled={true}
-                                href=""
-                                type="submit"
-                            >
-                                <span>
-                                    Save
-                                </span>
-                            </button>
-                        </div>
-                        <div
-                            className="c26"
-                        >
-                            <button
-                                className="c27 c23 c24"
-                                disabled={false}
-                                href=""
-                                icon={true}
-                                onClick={[Function]}
-                                type="button"
-                            >
-                                <svg
-                                    className=""
-                                    height="16"
-                                    innerRef={undefined}
-                                    style={
-                                        Object {
-                                            "transform": "rotate(0deg)",
-                                          }
-                                    }
-                                    viewBox="0 0 12 16"
-                                    width="12"
-                                    xmlns="http://www.w3.org/2000/svg"
-                                >
-                                    <path
-                                        d="M2.67,0V1.5H0V3H12V1.5H9.33V0ZM0,4,1.33,16h9.34L12,4ZM8,5h2.51l-1,10H8ZM1.49,5H4V15H2.53ZM7,15H5V5H7Z"
-                                        fill="rgb(210, 67, 58)"
-                                    />
-                                </svg>
-                                <span>
-                                    Remove
-                                </span>
-                            </button>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</form>,
-  .c3 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c3::-moz-focus-inner,
-.c3[type='button']::-moz-focus-inner,
-.c3[type='reset']::-moz-focus-inner,
-.c3[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c3:-moz-focusring,
-.c3[type='button']:-moz-focusring,
-.c3[type='reset']:-moz-focusring,
-.c3[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c3 + button,
-.c3 + a {
-  margin-left: 0.375rem;
-}
-
-.c2 {
-  display: inline-block;
-}
-
-.c2 + button,
-.c2 + a {
-  margin-left: 0.375rem;
-}
-
-.c1 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c1:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c1:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c1:active,
-.c1:active:hover,
-.c1:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c1[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c0 {
-  margin-top: 1.5rem;
-  margin-bottom: 2.625rem;
-}
-
-<div
-    className="c0"
->
-    <button
-        className="c1 c2 c3"
-        href=""
-        onClick={undefined}
-        type="submit"
-    >
-        Next
-    </button>
-</div>,
-]
-`;
-
-exports[`renders <UserScript proceeded /> without throwing 1`] = `
-Array [
-  .c3 {
-  font-size: 80%;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  color: rgba(73,73,73,1);
-  line-height: 1.125rem;
-  font-size: 0.8125rem;
-}
-
-.c6 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.625rem;
-  margin-left: -0.625rem;
-}
-
-.c5 {
-  background-color: rgb(216,216,216);
-  margin: 0;
-  height: 0.0625rem;
-}
-
-.c1 {
-  margin-right: 0.375rem;
-}
-
-.c4 {
-  margin-top: 0.375rem;
-  margin-bottom: 1.125rem;
-}
-
-.c0 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-}
-
-.c2 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-  -webkit-flex-basis: 100%;
-  -ms-flex-preferred-size: 100%;
-  flex-basis: 100%;
-}
-
-<div
-    className=""
-    id={undefined}
-    onClick={false}
->
-    <div
-        className="c0"
-    >
-        <div
-            className="c1"
-        >
-            <div
-                className="c2"
-            >
-                <svg
-                    className=""
-                    height="18"
-                    innerRef={undefined}
-                    style={
-                        Object {
-                            "transform": "rotate(0deg)",
-                          }
-                    }
-                    viewBox="0 0 15.43 18"
-                    width="15.43"
-                    xmlns="http://www.w3.org/2000/svg"
-                >
-                    <path
-                        d="M15.09,13.64,12.29,6h.14a3,3,0,0,0,0-6H3A3,3,0,0,0,0,3a3.37,3.37,0,0,0,.09.71,6.85,6.85,0,0,0,.25.64l3,7.68L3,12a3,3,0,0,0,0,6h9.43a2.94,2.94,0,0,0,3-3.43A7.54,7.54,0,0,0,15.09,13.64ZM12.43,1.46a1.54,1.54,0,1,1,0,3.08,1.52,1.52,0,0,1-1.27-.67l-.24-.6a1.24,1.24,0,0,1,0-.27A1.54,1.54,0,0,1,12.43,1.46ZM2,3.74l-.21-.52a.78.78,0,0,1,0-.22A1.29,1.29,0,0,1,3,1.71H9.73A3,3,0,0,0,9.43,3a2.76,2.76,0,0,0,.09.71L9.63,4c0,.09.77,2,.77,2l2.33,6-.3,0H5.36L2.88,6ZM9.73,16.29H3a1.29,1.29,0,0,1,0-2.58H9.73a2.92,2.92,0,0,0,0,2.58Zm2.7.25A1.54,1.54,0,1,1,14,15,1.54,1.54,0,0,1,12.43,16.54Z"
-                        fill="rgba(73, 73, 73, 1)"
-                    />
-                </svg>
-            </div>
-        </div>
-        <small
-            className="c3"
-        >
-            User Script
-        </small>
-    </div>
-    <div
-        className="c4"
-    >
-        <div
-            className="c5 c6"
-            height="0.0625rem"
-        />
-    </div>
-</div>,
-  .c23 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c23::-moz-focus-inner,
-.c23[type='button']::-moz-focus-inner,
-.c23[type='reset']::-moz-focus-inner,
-.c23[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c23:-moz-focusring,
-.c23[type='button']:-moz-focusring,
-.c23[type='reset']:-moz-focusring,
-.c23[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c23 + button,
-.c23 + a {
-  margin-left: 0.375rem;
-}
-
-.c15 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-  max-width: 100%;
-}
-
-.c22 {
-  display: inline-block;
-}
-
-.c22 + button,
-.c22 + a {
-  margin-left: 0.375rem;
-}
-
-.c21 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  margin: 0;
-}
-
-.c21:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c21:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c21[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c21:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c24 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  margin: 0;
-}
-
-.c24:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c24:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c24[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c24:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c24:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c26 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  margin: 0;
-  float: right;
-}
-
-.c26:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c26:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c26[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c26:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c26:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c26:focus {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c26:hover {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
-  background-color: rgba(210,67,58,0.1);
-  border-color: rgb(205,37,27);
-}
-
-.c26 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c26 svg {
-  max-height: 1.125rem;
-}
-
-.c13 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -7609,10 +7724,11 @@ Array [
   color: rgb(70,70,70);
   text-align: left;
   margin-bottom: 0.1875rem;
-  margin-right: 0.75rem;
-  font-weight: 600;
-  white-space: pre;
+  float: right;
   font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
 }
 
 .c10 {
@@ -7634,7 +7750,7 @@ Array [
   margin-left: -0.625rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -7673,7 +7789,7 @@ Array [
   display: block;
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -7704,7 +7820,7 @@ Array [
   margin-top: 0.75rem;
 }
 
-.c18 {
+.c19 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -7715,7 +7831,7 @@ Array [
   margin-top: 0.1875rem;
 }
 
-.c19 {
+.c20 {
   margin-top: 0.375rem;
 }
 
@@ -8035,7 +8151,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -8044,7 +8160,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c20 {
+  .c21 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -8071,7 +8187,7 @@ Array [
 }
 
 @media only screen and (min-width:0em) {
-  .c25 {
+  .c26 {
     display: none;
   }
 }
@@ -8151,26 +8267,30 @@ Array [
                             >
                                 <div
                                     className="c17"
-                                />
+                                >
+                                    <label
+                                        className="c18"
+                                    />
+                                </div>
                             </div>
                         </div>
                         <div
-                            className="c18 c10"
+                            className="c19 c10"
                             height="0.75rem"
                         />
                     </div>
                 </div>
                 <div
-                    className="c19"
+                    className="c20"
                 >
                     <div
-                        className="c20"
+                        className="c21"
                     >
                         <div
                             className="c11"
                         >
                             <button
-                                className="c21 c22 c23"
+                                className="c22 c23 c24"
                                 disabled={false}
                                 href=""
                                 onClick={[Function]}
@@ -8181,7 +8301,7 @@ Array [
                                 </span>
                             </button>
                             <button
-                                className="c24 c22 c23"
+                                className="c25 c23 c24"
                                 disabled={true}
                                 href=""
                                 type="submit"
@@ -8192,10 +8312,10 @@ Array [
                             </button>
                         </div>
                         <div
-                            className="c25"
+                            className="c26"
                         >
                             <button
-                                className="c26 c22 c23"
+                                className="c27 c23 c24"
                                 disabled={false}
                                 href=""
                                 icon={true}
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-1-snap.png
index f89a9987..9e23ee60 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-hostnames-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-hostnames-1-snap.png
index 722d6906..a0aa4e68 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-hostnames-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-hostnames-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-1-snap.png
index 80da7c3d..bb74b9a7 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-error-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-error-1-snap.png
index 25bfbd9c..a869730e 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-error-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-error-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-mutating-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-mutating-1-snap.png
index 6e3b1ad7..f11f7e24 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-mutating-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-mutating-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-mutation-error-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-mutation-error-1-snap.png
index 6083094c..8926d19e 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-mutation-error-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-mutation-error-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-services-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-services-1-snap.png
index 1989c15e..dc794679 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-services-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-services-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-1-snap.png
index e7af8acf..c100cdd4 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-inactive-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-inactive-1-snap.png
index 5f69483e..cc165ff3 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-inactive-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-inactive-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-loading-1-snap.png
index d75a7287..b8185b68 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-tag-rules-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-tag-rules-1-snap.png
index 5f3553aa..f82b0522 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-tag-rules-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-tag-rules-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-tag-rules-2-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-tag-rules-2-snap.png
index 555f3fbd..cea40912 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-tag-rules-2-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/firewall-ui-js-firewall-tag-rules-2-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-1-snap.png
index 92c2a48c..10e36bcd 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-all-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-all-1-snap.png
index 7301b535..9172122b 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-all-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-all-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-all-allowed-actions-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-all-allowed-actions-1-snap.png
index b3bce42e..374fdd5e 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-all-allowed-actions-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-instances-selected-all-allowed-actions-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-loading-1-snap.png
index 334ae84e..82d6c1ba 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/list-ui-js-list-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-add-open-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-add-open-1-snap.png
index edadc0dd..2bd4e372 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-add-open-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-add-open-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-loading-1-snap.png
index 0f24ca72..dc7784b3 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png
index 3450067a..73f13452 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/networks-ui-js-networks-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/networks-ui-js-networks-loading-1-snap.png
index 9431e8e7..b57541ca 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/networks-ui-js-networks-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/networks-ui-js-networks-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png
index ae2252eb..217b0c57 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png
index 99b81411..217b0c57 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-error-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-error-1-snap.png
index 99bbcb21..217b0c57 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-error-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-error-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png
index 5b56083d..31737473 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png
index f02804ce..217b0c57 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-add-open-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-add-open-1-snap.png
index 51732ce4..de386e05 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-add-open-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-add-open-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-1-snap.png
index ead59b66..f25daa28 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-removing-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-removing-1-snap.png
index 563debc4..cd4159fc 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-removing-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-removing-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-loading-1-snap.png
index 723cb08a..8eebdfeb 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/cns.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/cns.spec.js.snap
index dee0032b..aedd0f7e 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/cns.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/cns.spec.js.snap
@@ -21,7 +21,7 @@ exports[`renders <Cns /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c21 {
+.c22 {
   margin-top: 1.3125rem;
   margin-left: 0.75rem;
 }
@@ -39,7 +39,7 @@ exports[`renders <Cns /> without throwing 1`] = `
   padding-bottom: 1.125rem;
 }
 
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -52,23 +52,23 @@ exports[`renders <Cns /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c24::-moz-focus-inner,
-.c24[type='button']::-moz-focus-inner,
-.c24[type='reset']::-moz-focus-inner,
-.c24[type='submit']::-moz-focus-inner {
+.c25::-moz-focus-inner,
+.c25[type='button']::-moz-focus-inner,
+.c25[type='reset']::-moz-focus-inner,
+.c25[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c24:-moz-focusring,
-.c24[type='button']:-moz-focusring,
-.c24[type='reset']:-moz-focusring,
-.c24[type='submit']:-moz-focusring {
+.c25:-moz-focusring,
+.c25[type='button']:-moz-focusring,
+.c25[type='reset']:-moz-focusring,
+.c25[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button,
-.c24 + a {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
@@ -79,16 +79,16 @@ exports[`renders <Cns /> without throwing 1`] = `
   margin: 0;
 }
 
-.c23 {
+.c24 {
   display: inline-block;
 }
 
-.c23 + button,
-.c23 + a {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -128,7 +128,7 @@ exports[`renders <Cns /> without throwing 1`] = `
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -136,21 +136,21 @@ exports[`renders <Cns /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c22:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c22[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
@@ -170,6 +170,22 @@ exports[`renders <Cns /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c21 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c0 {
   margin-right: auto;
   margin-left: auto;
@@ -235,7 +251,7 @@ exports[`renders <Cns /> without throwing 1`] = `
   height: 0.0625rem;
 }
 
-.c25 {
+.c26 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -288,7 +304,7 @@ exports[`renders <Cns /> without throwing 1`] = `
   flex-wrap: wrap;
 }
 
-.c26 {
+.c27 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -427,7 +443,7 @@ exports[`renders <Cns /> without throwing 1`] = `
   color: rgba(73,73,73,0.5);
 }
 
-.c27 {
+.c28 {
   position: relative;
   vertical-align: text-bottom;
   display: -webkit-box;
@@ -440,27 +456,27 @@ exports[`renders <Cns /> without throwing 1`] = `
   align-items: center;
 }
 
-.c28 {
+.c29 {
   display: none;
 }
 
-.c28:checked + label {
+.c29:checked + label {
   background: #3B46CC;
   border: 0.0625rem solid rgb(59,70,204);
 }
 
-.c28:checked + label:after {
+.c29:checked + label:after {
   -webkit-transform: translateX(100%);
   -ms-transform: translateX(100%);
   transform: translateX(100%);
   box-shadow: 0 0 0 0.0625rem rgb(59,70,204);
 }
 
-.c28:checked + label:active {
+.c29:checked + label:active {
   box-shadow: none;
 }
 
-.c29 {
+.c30 {
   outline: 0;
   display: block;
   width: 2.875rem;
@@ -480,24 +496,24 @@ exports[`renders <Cns /> without throwing 1`] = `
   margin-right: 0.375rem;
 }
 
-.c29::selection {
+.c30::selection {
   background: none;
 }
 
-.c29:active {
+.c30:active {
   box-shadow: inset 0 0 0 1.5rem rgb(216,216,216);
 }
 
-.c29:hover {
+.c30:hover {
   border: 0.0625rem solid rgb(59,70,204);
 }
 
-.c29:hover:after {
+.c30:hover:after {
   box-shadow: 0 0 0 0.0625rem rgb(59,70,204);
 }
 
-.c29:after,
-.c29:before {
+.c30:after,
+.c30:before {
   position: relative;
   display: block;
   content: '';
@@ -505,7 +521,7 @@ exports[`renders <Cns /> without throwing 1`] = `
   height: 100%;
 }
 
-.c29:after {
+.c30:after {
   -webkit-transform: translateX(0%);
   -ms-transform: translateX(0%);
   transform: translateX(0%);
@@ -517,11 +533,11 @@ exports[`renders <Cns /> without throwing 1`] = `
   box-shadow: 0 0 0 0.0625rem rgb(216,216,216);
 }
 
-.c29:active {
+.c30:active {
   box-shadow: inset 0 0 0 2em rgb(216,216,216);
 }
 
-.c29:before {
+.c30:before {
   display: none;
 }
 
@@ -686,6 +702,9 @@ exports[`renders <Cns /> without throwing 1`] = `
                       placeholder="Example: mySQLdb"
                       required={true}
                     />
+                    <label
+                      className="c21"
+                    />
                   </div>
                 </div>
               </div>
@@ -693,10 +712,10 @@ exports[`renders <Cns /> without throwing 1`] = `
                 className="c16"
               >
                 <div
-                  className="c21"
+                  className="c22"
                 >
                   <button
-                    className="c22 c23 c24"
+                    className="c23 c24 c25"
                     disabled={undefined}
                     href=""
                     type="submit"
@@ -704,7 +723,7 @@ exports[`renders <Cns /> without throwing 1`] = `
                     Add
                   </button>
                   <div
-                    className="c25 c2"
+                    className="c26 c2"
                     height="0.25rem"
                   />
                 </div>
@@ -732,7 +751,7 @@ exports[`renders <Cns /> without throwing 1`] = `
       style={undefined}
     >
       <div
-        className="c26"
+        className="c27"
       >
         <label
           className="c18"
@@ -742,11 +761,11 @@ exports[`renders <Cns /> without throwing 1`] = `
           Disabled CNS
         </label>
         <div
-          className="c27"
+          className="c28"
         >
           <input
             checked={true}
-            className="c28"
+            className="c29"
             disabled={false}
             id="l"
             onBlur={undefined}
@@ -755,7 +774,7 @@ exports[`renders <Cns /> without throwing 1`] = `
           />
           <label
             checked={true}
-            className="c29"
+            className="c30"
             disabled={false}
             htmlFor="l"
             id="l"
@@ -1155,7 +1174,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c30 {
+.c31 {
   margin-top: 1.3125rem;
   margin-left: 0.75rem;
 }
@@ -1164,7 +1183,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   margin-right: 0.375rem;
 }
 
-.c35 {
+.c36 {
   margin-top: 0.1875rem;
   margin-bottom: 0.375rem;
 }
@@ -1199,7 +1218,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
-.c33 {
+.c34 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -1212,23 +1231,23 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c33::-moz-focus-inner,
-.c33[type='button']::-moz-focus-inner,
-.c33[type='reset']::-moz-focus-inner,
-.c33[type='submit']::-moz-focus-inner {
+.c34::-moz-focus-inner,
+.c34[type='button']::-moz-focus-inner,
+.c34[type='reset']::-moz-focus-inner,
+.c34[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c33:-moz-focusring,
-.c33[type='button']:-moz-focusring,
-.c33[type='reset']:-moz-focusring,
-.c33[type='submit']:-moz-focusring {
+.c34:-moz-focusring,
+.c34[type='button']:-moz-focusring,
+.c34[type='reset']:-moz-focusring,
+.c34[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c33 + button,
-.c33 + a {
+.c34 + button,
+.c34 + a {
   margin-left: 0.375rem;
 }
 
@@ -1243,16 +1262,16 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   margin: 0;
 }
 
-.c32 {
+.c33 {
   display: inline-block;
 }
 
-.c32 + button,
-.c32 + a {
+.c33 + button,
+.c33 + a {
   margin-left: 0.375rem;
 }
 
-.c31 {
+.c32 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1292,7 +1311,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c31:focus {
+.c32:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1300,21 +1319,21 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c31:hover {
+.c32:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c31:active,
-.c31:active:hover,
-.c31:active:focus {
+.c32:active,
+.c32:active:hover,
+.c32:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c31[disabled] {
+.c32[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
@@ -1334,6 +1353,22 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c30 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c0 {
   margin-right: auto;
   margin-left: auto;
@@ -1409,7 +1444,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   height: 0.0625rem;
 }
 
-.c34 {
+.c35 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -1462,7 +1497,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   flex-wrap: wrap;
 }
 
-.c36 {
+.c37 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1714,7 +1749,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   color: rgba(73,73,73,1);
 }
 
-.c37 {
+.c38 {
   position: relative;
   vertical-align: text-bottom;
   display: -webkit-box;
@@ -1727,27 +1762,27 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   align-items: center;
 }
 
-.c38 {
+.c39 {
   display: none;
 }
 
-.c38:checked + label {
+.c39:checked + label {
   background: #3B46CC;
   border: 0.0625rem solid rgb(59,70,204);
 }
 
-.c38:checked + label:after {
+.c39:checked + label:after {
   -webkit-transform: translateX(100%);
   -ms-transform: translateX(100%);
   transform: translateX(100%);
   box-shadow: 0 0 0 0.0625rem rgb(59,70,204);
 }
 
-.c38:checked + label:active {
+.c39:checked + label:active {
   box-shadow: none;
 }
 
-.c39 {
+.c40 {
   outline: 0;
   display: block;
   width: 2.875rem;
@@ -1767,24 +1802,24 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   margin-right: 0.375rem;
 }
 
-.c39::selection {
+.c40::selection {
   background: none;
 }
 
-.c39:active {
+.c40:active {
   box-shadow: inset 0 0 0 1.5rem rgb(216,216,216);
 }
 
-.c39:hover {
+.c40:hover {
   border: 0.0625rem solid rgb(59,70,204);
 }
 
-.c39:hover:after {
+.c40:hover:after {
   box-shadow: 0 0 0 0.0625rem rgb(59,70,204);
 }
 
-.c39:after,
-.c39:before {
+.c40:after,
+.c40:before {
   position: relative;
   display: block;
   content: '';
@@ -1792,7 +1827,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   height: 100%;
 }
 
-.c39:after {
+.c40:after {
   -webkit-transform: translateX(0%);
   -ms-transform: translateX(0%);
   transform: translateX(0%);
@@ -1804,11 +1839,11 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   box-shadow: 0 0 0 0.0625rem rgb(216,216,216);
 }
 
-.c39:active {
+.c40:active {
   box-shadow: inset 0 0 0 2em rgb(216,216,216);
 }
 
-.c39:before {
+.c40:before {
   display: none;
 }
 
@@ -2220,6 +2255,9 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
                       placeholder="Example: mySQLdb"
                       required={true}
                     />
+                    <label
+                      className="c30"
+                    />
                   </div>
                 </div>
               </div>
@@ -2227,10 +2265,10 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
                 className="c15"
               >
                 <div
-                  className="c30"
+                  className="c31"
                 >
                   <button
-                    className="c31 c32 c33"
+                    className="c32 c33 c34"
                     disabled={undefined}
                     href=""
                     type="submit"
@@ -2238,7 +2276,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
                     Add
                   </button>
                   <div
-                    className="c34 c2"
+                    className="c35 c2"
                     height="0.25rem"
                   />
                 </div>
@@ -2301,7 +2339,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
                   </div>
                 </div>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <div
                     className="c2"
@@ -2351,7 +2389,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
                   </div>
                 </div>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <div
                     className="c2"
@@ -2502,7 +2540,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
                   </div>
                 </div>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <div
                     className="c2"
@@ -2552,7 +2590,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
                   </div>
                 </div>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <div
                     className="c2"
@@ -2668,7 +2706,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
       style={undefined}
     >
       <div
-        className="c36"
+        className="c37"
       >
         <label
           className="c28"
@@ -2678,11 +2716,11 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
           Disabled CNS
         </label>
         <div
-          className="c37"
+          className="c38"
         >
           <input
             checked={true}
-            className="c38"
+            className="c39"
             disabled={false}
             id="v"
             onBlur={undefined}
@@ -2691,7 +2729,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
           />
           <label
             checked={true}
-            className="c39"
+            className="c40"
             disabled={false}
             htmlFor="v"
             id="v"
@@ -2983,7 +3021,7 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c26 {
+.c27 {
   margin-top: 1.3125rem;
   margin-left: 0.75rem;
 }
@@ -3001,7 +3039,7 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
   padding-bottom: 1.125rem;
 }
 
-.c29 {
+.c30 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -3014,23 +3052,23 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c29::-moz-focus-inner,
-.c29[type='button']::-moz-focus-inner,
-.c29[type='reset']::-moz-focus-inner,
-.c29[type='submit']::-moz-focus-inner {
+.c30::-moz-focus-inner,
+.c30[type='button']::-moz-focus-inner,
+.c30[type='reset']::-moz-focus-inner,
+.c30[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c29:-moz-focusring,
-.c29[type='button']:-moz-focusring,
-.c29[type='reset']:-moz-focusring,
-.c29[type='submit']:-moz-focusring {
+.c30:-moz-focusring,
+.c30[type='button']:-moz-focusring,
+.c30[type='reset']:-moz-focusring,
+.c30[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c29 + button,
-.c29 + a {
+.c30 + button,
+.c30 + a {
   margin-left: 0.375rem;
 }
 
@@ -3050,16 +3088,16 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
-.c28 {
+.c29 {
   display: inline-block;
 }
 
-.c28 + button,
-.c28 + a {
+.c29 + button,
+.c29 + a {
   margin-left: 0.375rem;
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3099,7 +3137,7 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3107,21 +3145,21 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
@@ -3141,6 +3179,22 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c26 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c0 {
   margin-right: auto;
   margin-left: auto;
@@ -3214,7 +3268,7 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
   height: 0.0625rem;
 }
 
-.c30 {
+.c31 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -3594,6 +3648,9 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
                       placeholder="Example: mySQLdb"
                       required={true}
                     />
+                    <label
+                      className="c26"
+                    />
                   </div>
                 </div>
               </div>
@@ -3601,10 +3658,10 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
                 className="c21"
               >
                 <div
-                  className="c26"
+                  className="c27"
                 >
                   <button
-                    className="c27 c28 c29"
+                    className="c28 c29 c30"
                     disabled={undefined}
                     href=""
                     type="submit"
@@ -3612,7 +3669,7 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
                     Add
                   </button>
                   <div
-                    className="c30 c2"
+                    className="c31 c2"
                     height="0.25rem"
                   />
                 </div>
@@ -3654,7 +3711,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c35 {
+.c36 {
   margin-top: 1.3125rem;
   margin-left: 0.75rem;
 }
@@ -3672,7 +3729,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   margin-bottom: 0.375rem;
 }
 
-.c40 {
+.c41 {
   margin-top: 0.1875rem;
   margin-bottom: 0.375rem;
 }
@@ -3707,7 +3764,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
-.c38 {
+.c39 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -3720,23 +3777,23 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c38::-moz-focus-inner,
-.c38[type='button']::-moz-focus-inner,
-.c38[type='reset']::-moz-focus-inner,
-.c38[type='submit']::-moz-focus-inner {
+.c39::-moz-focus-inner,
+.c39[type='button']::-moz-focus-inner,
+.c39[type='reset']::-moz-focus-inner,
+.c39[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c38:-moz-focusring,
-.c38[type='button']:-moz-focusring,
-.c38[type='reset']:-moz-focusring,
-.c38[type='submit']:-moz-focusring {
+.c39:-moz-focusring,
+.c39[type='button']:-moz-focusring,
+.c39[type='reset']:-moz-focusring,
+.c39[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c38 + button,
-.c38 + a {
+.c39 + button,
+.c39 + a {
   margin-left: 0.375rem;
 }
 
@@ -3751,16 +3808,16 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   margin: 0;
 }
 
-.c37 {
+.c38 {
   display: inline-block;
 }
 
-.c37 + button,
-.c37 + a {
+.c38 + button,
+.c38 + a {
   margin-left: 0.375rem;
 }
 
-.c36 {
+.c37 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3800,7 +3857,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c36:focus {
+.c37:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3808,21 +3865,21 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c36:hover {
+.c37:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c36:active,
-.c36:active:hover,
-.c36:active:focus {
+.c37:active,
+.c37:active:hover,
+.c37:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c36[disabled] {
+.c37[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
@@ -3842,7 +3899,23 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
-.c42 {
+.c35 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
+.c43 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -3933,7 +4006,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   height: 0.0625rem;
 }
 
-.c39 {
+.c40 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -3986,7 +4059,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   flex-wrap: wrap;
 }
 
-.c41 {
+.c42 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -4253,7 +4326,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   color: rgba(73,73,73,0.5);
 }
 
-.c43 {
+.c44 {
   position: relative;
   vertical-align: text-bottom;
   display: -webkit-box;
@@ -4266,36 +4339,36 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   align-items: center;
 }
 
-.c44 {
+.c45 {
   display: none;
 }
 
-.c44:checked + label {
+.c45:checked + label {
   background: #3B46CC;
   border: 0.0625rem solid rgb(59,70,204);
 }
 
-.c44:checked + label:after {
+.c45:checked + label:after {
   -webkit-transform: translateX(100%);
   -ms-transform: translateX(100%);
   transform: translateX(100%);
   box-shadow: 0 0 0 0.0625rem rgb(59,70,204);
 }
 
-.c44:checked + label:active {
+.c45:checked + label:active {
   box-shadow: none;
 }
 
-.c44:checked + label {
+.c45:checked + label {
   background: rgb(250,250,250);
   border: 0.0625rem solid rgb(216,216,216);
 }
 
-.c44:checked + label:after {
+.c45:checked + label:after {
   box-shadow: 0 0 0 0.0625rem rgb(216,216,216);
 }
 
-.c45 {
+.c46 {
   outline: 0;
   display: block;
   width: 2.875rem;
@@ -4316,24 +4389,24 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   cursor: not-allowed;
 }
 
-.c45::selection {
+.c46::selection {
   background: none;
 }
 
-.c45:active {
+.c46:active {
   box-shadow: inset 0 0 0 1.5rem rgb(216,216,216);
 }
 
-.c45:hover {
+.c46:hover {
   border: 0.0625rem solid rgb(59,70,204);
 }
 
-.c45:hover:after {
+.c46:hover:after {
   box-shadow: 0 0 0 0.0625rem rgb(59,70,204);
 }
 
-.c45:after,
-.c45:before {
+.c46:after,
+.c46:before {
   position: relative;
   display: block;
   content: '';
@@ -4341,7 +4414,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   height: 100%;
 }
 
-.c45:after {
+.c46:after {
   -webkit-transform: translateX(0%);
   -ms-transform: translateX(0%);
   transform: translateX(0%);
@@ -4353,36 +4426,36 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   box-shadow: 0 0 0 0.0625rem rgb(216,216,216);
 }
 
-.c45:active {
+.c46:active {
   box-shadow: inset 0 0 0 2em rgb(216,216,216);
 }
 
-.c45:before {
+.c46:before {
   display: none;
 }
 
-.c45:active {
+.c46:active {
   box-shadow: none;
 }
 
-.c45:active:after {
+.c46:active:after {
   padding-right: 0;
 }
 
-.c45:before {
+.c46:before {
   cursor: not-allowed;
 }
 
-.c45:after {
+.c46:after {
   cursor: not-allowed;
   background: rgb(230,230,230);
 }
 
-.c45:hover {
+.c46:hover {
   border: 0.0625rem solid rgb(216,216,216);
 }
 
-.c45:hover:after {
+.c46:hover:after {
   box-shadow: 0 0 0 0.0625rem rgb(216,216,216);
 }
 
@@ -4905,6 +4978,9 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
                       placeholder="Example: mySQLdb"
                       required={true}
                     />
+                    <label
+                      className="c35"
+                    />
                   </div>
                 </div>
               </div>
@@ -4912,10 +4988,10 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
                 className="c15"
               >
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <button
-                    className="c36 c37 c38"
+                    className="c37 c38 c39"
                     disabled={undefined}
                     href=""
                     type="submit"
@@ -4923,7 +4999,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
                     Add
                   </button>
                   <div
-                    className="c39 c2"
+                    className="c40 c2"
                     height="0.25rem"
                   />
                 </div>
@@ -4986,7 +5062,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
                   </div>
                 </div>
                 <div
-                  className="c40"
+                  className="c41"
                 >
                   <div
                     className="c2"
@@ -5036,7 +5112,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
                   </div>
                 </div>
                 <div
-                  className="c40"
+                  className="c41"
                 >
                   <div
                     className="c2"
@@ -5187,7 +5263,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
                   </div>
                 </div>
                 <div
-                  className="c40"
+                  className="c41"
                 >
                   <div
                     className="c2"
@@ -5237,7 +5313,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
                   </div>
                 </div>
                 <div
-                  className="c40"
+                  className="c41"
                 >
                   <div
                     className="c2"
@@ -5353,21 +5429,21 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
       style={undefined}
     >
       <div
-        className="c41"
+        className="c42"
       >
         <label
-          className="c42"
+          className="c43"
           disabled={true}
           htmlFor="q"
         >
           Disabled CNS
         </label>
         <div
-          className="c43"
+          className="c44"
         >
           <input
             checked={true}
-            className="c44"
+            className="c45"
             disabled={true}
             id="q"
             onBlur={undefined}
@@ -5376,7 +5452,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
           />
           <label
             checked={true}
-            className="c45"
+            className="c46"
             disabled={true}
             htmlFor="q"
             id="q"
@@ -5385,7 +5461,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
           />
           <label
             checked={true}
-            className="c42"
+            className="c43"
             disabled={true}
             htmlFor="q"
             id="q"
@@ -5432,7 +5508,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c26 {
+.c27 {
   margin-top: 1.3125rem;
   margin-left: 0.75rem;
 }
@@ -5450,7 +5526,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   padding-bottom: 1.125rem;
 }
 
-.c29 {
+.c30 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -5463,23 +5539,23 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c29::-moz-focus-inner,
-.c29[type='button']::-moz-focus-inner,
-.c29[type='reset']::-moz-focus-inner,
-.c29[type='submit']::-moz-focus-inner {
+.c30::-moz-focus-inner,
+.c30[type='button']::-moz-focus-inner,
+.c30[type='reset']::-moz-focus-inner,
+.c30[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c29:-moz-focusring,
-.c29[type='button']:-moz-focusring,
-.c29[type='reset']:-moz-focusring,
-.c29[type='submit']:-moz-focusring {
+.c30:-moz-focusring,
+.c30[type='button']:-moz-focusring,
+.c30[type='reset']:-moz-focusring,
+.c30[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c29 + button,
-.c29 + a {
+.c30 + button,
+.c30 + a {
   margin-left: 0.375rem;
 }
 
@@ -5499,16 +5575,16 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
-.c28 {
+.c29 {
   display: inline-block;
 }
 
-.c28 + button,
-.c28 + a {
+.c29 + button,
+.c29 + a {
   margin-left: 0.375rem;
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -5548,7 +5624,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -5556,21 +5632,21 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
@@ -5590,6 +5666,22 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c26 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c0 {
   margin-right: auto;
   margin-left: auto;
@@ -5663,7 +5755,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   height: 0.0625rem;
 }
 
-.c30 {
+.c31 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -5716,7 +5808,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   flex-wrap: wrap;
 }
 
-.c31 {
+.c32 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -5881,7 +5973,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   color: rgba(73,73,73,0.5);
 }
 
-.c32 {
+.c33 {
   position: relative;
   vertical-align: text-bottom;
   display: -webkit-box;
@@ -5894,27 +5986,27 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   align-items: center;
 }
 
-.c33 {
+.c34 {
   display: none;
 }
 
-.c33:checked + label {
+.c34:checked + label {
   background: #3B46CC;
   border: 0.0625rem solid rgb(59,70,204);
 }
 
-.c33:checked + label:after {
+.c34:checked + label:after {
   -webkit-transform: translateX(100%);
   -ms-transform: translateX(100%);
   transform: translateX(100%);
   box-shadow: 0 0 0 0.0625rem rgb(59,70,204);
 }
 
-.c33:checked + label:active {
+.c34:checked + label:active {
   box-shadow: none;
 }
 
-.c34 {
+.c35 {
   outline: 0;
   display: block;
   width: 2.875rem;
@@ -5934,24 +6026,24 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   margin-right: 0.375rem;
 }
 
-.c34::selection {
+.c35::selection {
   background: none;
 }
 
-.c34:active {
+.c35:active {
   box-shadow: inset 0 0 0 1.5rem rgb(216,216,216);
 }
 
-.c34:hover {
+.c35:hover {
   border: 0.0625rem solid rgb(59,70,204);
 }
 
-.c34:hover:after {
+.c35:hover:after {
   box-shadow: 0 0 0 0.0625rem rgb(59,70,204);
 }
 
-.c34:after,
-.c34:before {
+.c35:after,
+.c35:before {
   position: relative;
   display: block;
   content: '';
@@ -5959,7 +6051,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   height: 100%;
 }
 
-.c34:after {
+.c35:after {
   -webkit-transform: translateX(0%);
   -ms-transform: translateX(0%);
   transform: translateX(0%);
@@ -5971,11 +6063,11 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   box-shadow: 0 0 0 0.0625rem rgb(216,216,216);
 }
 
-.c34:active {
+.c35:active {
   box-shadow: inset 0 0 0 2em rgb(216,216,216);
 }
 
-.c34:before {
+.c35:before {
   display: none;
 }
 
@@ -6165,6 +6257,9 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
                       placeholder="Example: mySQLdb"
                       required={true}
                     />
+                    <label
+                      className="c26"
+                    />
                   </div>
                 </div>
               </div>
@@ -6172,10 +6267,10 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
                 className="c21"
               >
                 <div
-                  className="c26"
+                  className="c27"
                 >
                   <button
-                    className="c27 c28 c29"
+                    className="c28 c29 c30"
                     disabled={undefined}
                     href=""
                     type="submit"
@@ -6183,7 +6278,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
                     Add
                   </button>
                   <div
-                    className="c30 c2"
+                    className="c31 c2"
                     height="0.25rem"
                   />
                 </div>
@@ -6211,7 +6306,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
       style={undefined}
     >
       <div
-        className="c31"
+        className="c32"
       >
         <label
           className="c23"
@@ -6221,11 +6316,11 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
           Disabled CNS
         </label>
         <div
-          className="c32"
+          className="c33"
         >
           <input
             checked={true}
-            className="c33"
+            className="c34"
             disabled={false}
             id="o"
             onBlur={undefined}
@@ -6234,7 +6329,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
           />
           <label
             checked={true}
-            className="c34"
+            className="c35"
             disabled={false}
             htmlFor="o"
             id="o"
@@ -6290,7 +6385,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c27 {
+.c28 {
   margin-top: 1.3125rem;
   margin-left: 0.75rem;
 }
@@ -6317,7 +6412,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
   padding-bottom: 1.125rem;
 }
 
-.c30 {
+.c31 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -6330,23 +6425,23 @@ exports[`renders <Cns services /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c30::-moz-focus-inner,
-.c30[type='button']::-moz-focus-inner,
-.c30[type='reset']::-moz-focus-inner,
-.c30[type='submit']::-moz-focus-inner {
+.c31::-moz-focus-inner,
+.c31[type='button']::-moz-focus-inner,
+.c31[type='reset']::-moz-focus-inner,
+.c31[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c30:-moz-focusring,
-.c30[type='button']:-moz-focusring,
-.c30[type='reset']:-moz-focusring,
-.c30[type='submit']:-moz-focusring {
+.c31:-moz-focusring,
+.c31[type='button']:-moz-focusring,
+.c31[type='reset']:-moz-focusring,
+.c31[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c30 + button,
-.c30 + a {
+.c31 + button,
+.c31 + a {
   margin-left: 0.375rem;
 }
 
@@ -6362,16 +6457,16 @@ exports[`renders <Cns services /> without throwing 1`] = `
   margin: 0;
 }
 
-.c29 {
+.c30 {
   display: inline-block;
 }
 
-.c29 + button,
-.c29 + a {
+.c30 + button,
+.c30 + a {
   margin-left: 0.375rem;
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -6411,7 +6506,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c28:focus {
+.c29:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -6419,21 +6514,21 @@ exports[`renders <Cns services /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c28:hover {
+.c29:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c28[disabled] {
+.c29[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
@@ -6453,6 +6548,22 @@ exports[`renders <Cns services /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c27 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c0 {
   margin-right: auto;
   margin-left: auto;
@@ -6518,7 +6629,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
   height: 0.0625rem;
 }
 
-.c31 {
+.c32 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -6571,7 +6682,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
   flex-wrap: wrap;
 }
 
-.c32 {
+.c33 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -6710,7 +6821,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
   color: rgba(73,73,73,0.5);
 }
 
-.c33 {
+.c34 {
   position: relative;
   vertical-align: text-bottom;
   display: -webkit-box;
@@ -6723,27 +6834,27 @@ exports[`renders <Cns services /> without throwing 1`] = `
   align-items: center;
 }
 
-.c34 {
+.c35 {
   display: none;
 }
 
-.c34:checked + label {
+.c35:checked + label {
   background: #3B46CC;
   border: 0.0625rem solid rgb(59,70,204);
 }
 
-.c34:checked + label:after {
+.c35:checked + label:after {
   -webkit-transform: translateX(100%);
   -ms-transform: translateX(100%);
   transform: translateX(100%);
   box-shadow: 0 0 0 0.0625rem rgb(59,70,204);
 }
 
-.c34:checked + label:active {
+.c35:checked + label:active {
   box-shadow: none;
 }
 
-.c35 {
+.c36 {
   outline: 0;
   display: block;
   width: 2.875rem;
@@ -6763,24 +6874,24 @@ exports[`renders <Cns services /> without throwing 1`] = `
   margin-right: 0.375rem;
 }
 
-.c35::selection {
+.c36::selection {
   background: none;
 }
 
-.c35:active {
+.c36:active {
   box-shadow: inset 0 0 0 1.5rem rgb(216,216,216);
 }
 
-.c35:hover {
+.c36:hover {
   border: 0.0625rem solid rgb(59,70,204);
 }
 
-.c35:hover:after {
+.c36:hover:after {
   box-shadow: 0 0 0 0.0625rem rgb(59,70,204);
 }
 
-.c35:after,
-.c35:before {
+.c36:after,
+.c36:before {
   position: relative;
   display: block;
   content: '';
@@ -6788,7 +6899,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
   height: 100%;
 }
 
-.c35:after {
+.c36:after {
   -webkit-transform: translateX(0%);
   -ms-transform: translateX(0%);
   transform: translateX(0%);
@@ -6800,11 +6911,11 @@ exports[`renders <Cns services /> without throwing 1`] = `
   box-shadow: 0 0 0 0.0625rem rgb(216,216,216);
 }
 
-.c35:active {
+.c36:active {
   box-shadow: inset 0 0 0 2em rgb(216,216,216);
 }
 
-.c35:before {
+.c36:before {
   display: none;
 }
 
@@ -7137,6 +7248,9 @@ exports[`renders <Cns services /> without throwing 1`] = `
                       placeholder="Example: mySQLdb"
                       required={true}
                     />
+                    <label
+                      className="c27"
+                    />
                   </div>
                 </div>
               </div>
@@ -7144,10 +7258,10 @@ exports[`renders <Cns services /> without throwing 1`] = `
                 className="c23"
               >
                 <div
-                  className="c27"
+                  className="c28"
                 >
                   <button
-                    className="c28 c29 c30"
+                    className="c29 c30 c31"
                     disabled={undefined}
                     href=""
                     type="submit"
@@ -7155,7 +7269,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
                     Add
                   </button>
                   <div
-                    className="c31 c2"
+                    className="c32 c2"
                     height="0.25rem"
                   />
                 </div>
@@ -7183,7 +7297,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
       style={undefined}
     >
       <div
-        className="c32"
+        className="c33"
       >
         <label
           className="c15"
@@ -7193,11 +7307,11 @@ exports[`renders <Cns services /> without throwing 1`] = `
           Disabled CNS
         </label>
         <div
-          className="c33"
+          className="c34"
         >
           <input
             checked={true}
-            className="c34"
+            className="c35"
             disabled={false}
             id="t"
             onBlur={undefined}
@@ -7206,7 +7320,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
           />
           <label
             checked={true}
-            className="c35"
+            className="c36"
             disabled={false}
             htmlFor="t"
             id="t"
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap
index 172ed786..fe6aa438 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap
@@ -465,11 +465,11 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c32 {
+.c33 {
   margin-top: 0.375rem;
 }
 
-.c38 {
+.c39 {
   margin-top: 1.5rem;
   margin-bottom: 1.5rem;
 }
@@ -516,7 +516,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
-.c30 {
+.c31 {
   position: relative;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
@@ -623,7 +623,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c34 {
+.c35 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -668,7 +668,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   margin: 0;
 }
 
-.c34:focus {
+.c35:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -676,43 +676,43 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c34:hover {
+.c35:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c34:active,
-.c34:active:hover,
-.c34:active:focus {
+.c35:active,
+.c35:active:hover,
+.c35:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c34[disabled] {
+.c35[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c34:focus {
+.c35:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c34:hover {
+.c35:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c34:active,
-.c34:active:hover,
-.c34:active:focus {
+.c35:active,
+.c35:active:hover,
+.c35:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c35 {
+.c36 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -758,7 +758,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   margin: 0;
 }
 
-.c35:focus {
+.c36:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -766,43 +766,43 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c35:hover {
+.c36:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c35:active,
-.c35:active:hover,
-.c35:active:focus {
+.c36:active,
+.c36:active:hover,
+.c36:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c35[disabled] {
+.c36[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c35:focus {
+.c36:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c35:hover {
+.c36:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c35:active,
-.c35:active:hover,
-.c35:active:focus {
+.c36:active,
+.c36:active:hover,
+.c36:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c37 {
+.c38 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -860,7 +860,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   float: right;
 }
 
-.c37:focus {
+.c38:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -868,66 +868,66 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c37:hover {
+.c38:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c37[disabled] {
+.c38[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c37:focus {
+.c38:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c37:hover {
+.c38:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c37:focus {
+.c38:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c37:hover {
+.c38:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c37 svg + span {
+.c38 svg + span {
   margin-left: 0.75rem;
 }
 
-.c37 svg {
+.c38 svg {
   max-height: 1.125rem;
 }
 
@@ -946,6 +946,22 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c29 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c0 {
   margin-right: auto;
   margin-left: auto;
@@ -974,7 +990,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c33 {
+.c34 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1013,7 +1029,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   display: block;
 }
 
-.c36 {
+.c37 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1023,7 +1039,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   display: block;
 }
 
-.c39 {
+.c40 {
   color: rgba(73,73,73,1);
   font-weight: normal;
   line-height: 1.625rem;
@@ -1031,16 +1047,16 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   margin: 0;
 }
 
-.c39 + p,
-.c39 + small,
-.c39 + h1,
-.c39 + h2,
-.c39 + label,
-.c39 + h3,
-.c39 + h4,
-.c39 + h5,
-.c39 + div,
-.c39 + span {
+.c40 + p,
+.c40 + small,
+.c40 + h1,
+.c40 + h2,
+.c40 + label,
+.c40 + h3,
+.c40 + h4,
+.c40 + h5,
+.c40 + div,
+.c40 + span {
   margin-top: 1.5rem;
 }
 
@@ -1099,7 +1115,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   height: 1.5rem;
 }
 
-.c29 {
+.c30 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -1436,7 +1452,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   color: rgba(73,73,73,0.5);
 }
 
-.c31 {
+.c32 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 6rem;
@@ -1461,58 +1477,58 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   resize: vertical;
 }
 
-.c31:focus {
+.c32:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c31::-webkit-input-placeholder {
+.c32::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31::-moz-placeholder {
+.c32::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:-ms-input-placeholder {
+.c32:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:invalid {
+.c32:invalid {
   box-shadow: none;
 }
 
-.c31:disabled {
+.c32:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c31:disabled::-webkit-input-placeholder {
+.c32:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled::-moz-placeholder {
+.c32:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled:-ms-input-placeholder {
+.c32:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled {
+.c32:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c31:disabled::-webkit-input-placeholder {
+.c32:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c31:disabled::-moz-placeholder {
+.c32:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c31:disabled:-ms-input-placeholder {
+.c32:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
@@ -1554,7 +1570,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c33 {
+  .c34 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -1563,7 +1579,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c33 {
+  .c34 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -1590,7 +1606,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c36 {
+  .c37 {
     display: none;
   }
 }
@@ -1740,12 +1756,16 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
                   >
                     <div
                       className="c28"
-                    />
+                    >
+                      <label
+                        className="c29"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
               <div
-                className="c29 c8"
+                className="c30 c8"
                 height="0.75rem"
               />
             </div>
@@ -1773,7 +1793,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
                   className="c4"
                 >
                   <textarea
-                    className="c30 c31"
+                    className="c31 c32"
                     disabled={false}
                     id="x"
                     onBlur={undefined}
@@ -1784,26 +1804,30 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
                 >
                   <div
                     className="c28"
-                  />
+                  >
+                    <label
+                      className="c29"
+                    />
+                  </div>
                 </div>
               </div>
               <div
-                className="c29 c8"
+                className="c30 c8"
                 height="0.75rem"
               />
             </div>
           </div>
           <div
-            className="c32"
+            className="c33"
           >
             <div
-              className="c33"
+              className="c34"
             >
               <div
                 className="c26"
               >
                 <button
-                  className="c34 c10 c11"
+                  className="c35 c10 c11"
                   disabled={false}
                   href=""
                   onClick={[Function]}
@@ -1814,7 +1838,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
                   </span>
                 </button>
                 <button
-                  className="c35 c10 c11"
+                  className="c36 c10 c11"
                   disabled={true}
                   href=""
                   type="submit"
@@ -1825,10 +1849,10 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
                 </button>
               </div>
               <div
-                className="c36"
+                className="c37"
               >
                 <button
-                  className="c37 c10 c11"
+                  className="c38 c10 c11"
                   disabled={false}
                   href=""
                   icon={true}
@@ -1865,10 +1889,10 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
     </div>
   </form>
   <div
-    className="c38"
+    className="c39"
   >
     <h3
-      className="c39"
+      className="c40"
     >
       0
        key-value pair
@@ -2959,7 +2983,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   margin-bottom: 1.5rem;
 }
 
-.c35 {
+.c36 {
   margin-top: 0.375rem;
 }
 
@@ -3009,7 +3033,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
-.c33 {
+.c34 {
   position: relative;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
@@ -3022,14 +3046,14 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   max-width: 100%;
 }
 
-.c44 {
+.c45 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
   animation: iCqDak 1.5s ease-out 0s infinite;
 }
 
-.c45 {
+.c46 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -3038,7 +3062,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   animation-delay: 0.5s;
 }
 
-.c46 {
+.c47 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -3047,7 +3071,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   animation-delay: 1s;
 }
 
-.c43 {
+.c44 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -3169,7 +3193,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c38 {
+.c39 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3214,7 +3238,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   margin: 0;
 }
 
-.c38:focus {
+.c39:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3222,43 +3246,43 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c38:hover {
+.c39:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c38:active,
-.c38:active:hover,
-.c38:active:focus {
+.c39:active,
+.c39:active:hover,
+.c39:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c38[disabled] {
+.c39[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c38:focus {
+.c39:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c38:hover {
+.c39:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c38:active,
-.c38:active:hover,
-.c38:active:focus {
+.c39:active,
+.c39:active:hover,
+.c39:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c39 {
+.c40 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3304,7 +3328,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   margin: 0;
 }
 
-.c39:focus {
+.c40:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3312,171 +3336,42 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c39:hover {
+.c40:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c39:active,
-.c39:active:hover,
-.c39:active:focus {
+.c40:active,
+.c40:active:hover,
+.c40:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c39[disabled] {
+.c40[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c39:focus {
+.c40:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c39:hover {
+.c40:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c39:active,
-.c39:active:hover,
-.c39:active:focus {
+.c40:active,
+.c40:active:hover,
+.c40:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c41 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  margin: 0;
-  float: right;
-}
-
-.c41:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c41:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c41:active,
-.c41:active:hover,
-.c41:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c41[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c41:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c41:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c41:active,
-.c41:active:hover,
-.c41:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c41:focus {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c41:hover {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c41:active,
-.c41:active:hover,
-.c41:active:focus {
-  background-color: rgba(210,67,58,0.1);
-  border-color: rgb(205,37,27);
-}
-
-.c41 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c41 svg {
-  max-height: 1.125rem;
-}
-
 .c42 {
   box-sizing: border-box;
   display: inline-block;
@@ -3523,11 +3418,6 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(210,67,58);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -3603,23 +3493,6 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   border-color: rgb(205,37,27);
 }
 
-.c42:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c42:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c42:active,
-.c42:active:hover,
-.c42:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
 .c42 svg + span {
   margin-left: 0.75rem;
 }
@@ -3628,6 +3501,157 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c43 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  margin: 0;
+  float: right;
+}
+
+.c43:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c43:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c43:active,
+.c43:active:hover,
+.c43:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c43[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c43:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c43:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c43:active,
+.c43:active:hover,
+.c43:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c43:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c43:hover {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c43:active,
+.c43:active:hover,
+.c43:active:focus {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c43:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c43:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c43:active,
+.c43:active:hover,
+.c43:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c43 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c43 svg {
+  max-height: 1.125rem;
+}
+
 .c3 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
@@ -3643,6 +3667,22 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c32 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c0 {
   margin-right: auto;
   margin-left: auto;
@@ -3671,7 +3711,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c36 {
+.c37 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -3710,7 +3750,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   display: block;
 }
 
-.c37 {
+.c38 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -3720,7 +3760,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   display: block;
 }
 
-.c40 {
+.c41 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -3785,7 +3825,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   height: 1.5rem;
 }
 
-.c32 {
+.c33 {
   background-color: rgb(216,216,216);
   margin: 0;
   background-color: transparent;
@@ -4124,7 +4164,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   color: rgba(73,73,73,0.5);
 }
 
-.c34 {
+.c35 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 6rem;
@@ -4149,58 +4189,58 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   resize: vertical;
 }
 
-.c34:focus {
+.c35:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c34::-webkit-input-placeholder {
+.c35::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c34::-moz-placeholder {
+.c35::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c34:-ms-input-placeholder {
+.c35:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c34:invalid {
+.c35:invalid {
   box-shadow: none;
 }
 
-.c34:disabled {
+.c35:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c34:disabled::-webkit-input-placeholder {
+.c35:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c34:disabled::-moz-placeholder {
+.c35:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c34:disabled:-ms-input-placeholder {
+.c35:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c34:disabled {
+.c35:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c34:disabled::-webkit-input-placeholder {
+.c35:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c34:disabled::-moz-placeholder {
+.c35:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c34:disabled:-ms-input-placeholder {
+.c35:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
@@ -4251,7 +4291,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c36 {
+  .c37 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -4260,7 +4300,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c36 {
+  .c37 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -4287,7 +4327,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c37 {
+  .c38 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -4296,7 +4336,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c40 {
+  .c41 {
     -webkit-flex-basis: 41.66666666666667%;
     -ms-flex-preferred-size: 41.66666666666667%;
     flex-basis: 41.66666666666667%;
@@ -4480,12 +4520,16 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                     >
                       <div
                         className="c31"
-                      />
+                      >
+                        <label
+                          className="c32"
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
                 <div
-                  className="c32 c8"
+                  className="c33 c8"
                   height="0.75rem"
                 />
               </div>
@@ -4513,7 +4557,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                     className="c4"
                   >
                     <textarea
-                      className="c33 c34"
+                      className="c34 c35"
                       disabled={false}
                       id="C"
                       onBlur={undefined}
@@ -4524,26 +4568,30 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                   >
                     <div
                       className="c31"
-                    />
+                    >
+                      <label
+                        className="c32"
+                      />
+                    </div>
                   </div>
                 </div>
                 <div
-                  className="c32 c8"
+                  className="c33 c8"
                   height="0.75rem"
                 />
               </div>
             </div>
             <div
-              className="c35"
+              className="c36"
             >
               <div
-                className="c36"
+                className="c37"
               >
                 <div
-                  className="c37"
+                  className="c38"
                 >
                   <button
-                    className="c38 c10 c11"
+                    className="c39 c10 c11"
                     disabled={false}
                     href=""
                     onClick={[Function]}
@@ -4554,7 +4602,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                     </span>
                   </button>
                   <button
-                    className="c39 c10 c11"
+                    className="c40 c10 c11"
                     disabled={true}
                     href=""
                     type="submit"
@@ -4565,10 +4613,10 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                   </button>
                 </div>
                 <div
-                  className="c40"
+                  className="c41"
                 >
                   <button
-                    className="c41 c10 c11"
+                    className="c42 c10 c11"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4699,12 +4747,16 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                     >
                       <div
                         className="c31"
-                      />
+                      >
+                        <label
+                          className="c32"
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
                 <div
-                  className="c32 c8"
+                  className="c33 c8"
                   height="0.75rem"
                 />
               </div>
@@ -4732,7 +4784,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                     className="c4"
                   >
                     <textarea
-                      className="c33 c34"
+                      className="c34 c35"
                       disabled={false}
                       id="E"
                       onBlur={undefined}
@@ -4743,26 +4795,30 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                   >
                     <div
                       className="c31"
-                    />
+                    >
+                      <label
+                        className="c32"
+                      />
+                    </div>
                   </div>
                 </div>
                 <div
-                  className="c32 c8"
+                  className="c33 c8"
                   height="0.75rem"
                 />
               </div>
             </div>
             <div
-              className="c35"
+              className="c36"
             >
               <div
-                className="c36"
+                className="c37"
               >
                 <div
-                  className="c37"
+                  className="c38"
                 >
                   <button
-                    className="c38 c10 c11"
+                    className="c39 c10 c11"
                     disabled={false}
                     href=""
                     onClick={[Function]}
@@ -4773,7 +4829,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                     </span>
                   </button>
                   <button
-                    className="c39 c10 c11"
+                    className="c40 c10 c11"
                     disabled={true}
                     href=""
                     type="submit"
@@ -4784,10 +4840,10 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                   </button>
                 </div>
                 <div
-                  className="c40"
+                  className="c41"
                 >
                   <button
-                    className="c41 c10 c11"
+                    className="c42 c10 c11"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4918,12 +4974,16 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                     >
                       <div
                         className="c31"
-                      />
+                      >
+                        <label
+                          className="c32"
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
                 <div
-                  className="c32 c8"
+                  className="c33 c8"
                   height="0.75rem"
                 />
               </div>
@@ -4951,7 +5011,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                     className="c4"
                   >
                     <textarea
-                      className="c33 c34"
+                      className="c34 c35"
                       disabled={false}
                       id="G"
                       onBlur={undefined}
@@ -4962,26 +5022,30 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                   >
                     <div
                       className="c31"
-                    />
+                    >
+                      <label
+                        className="c32"
+                      />
+                    </div>
                   </div>
                 </div>
                 <div
-                  className="c32 c8"
+                  className="c33 c8"
                   height="0.75rem"
                 />
               </div>
             </div>
             <div
-              className="c35"
+              className="c36"
             >
               <div
-                className="c36"
+                className="c37"
               >
                 <div
-                  className="c37"
+                  className="c38"
                 >
                   <button
-                    className="c38 c10 c11"
+                    className="c39 c10 c11"
                     disabled={false}
                     href=""
                     onClick={[Function]}
@@ -4992,7 +5056,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                     </span>
                   </button>
                   <button
-                    className="c39 c10 c11"
+                    className="c40 c10 c11"
                     disabled={true}
                     href=""
                     type="submit"
@@ -5003,10 +5067,10 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                   </button>
                 </div>
                 <div
-                  className="c40"
+                  className="c41"
                 >
                   <button
-                    className="c42 c10 c11"
+                    className="c43 c10 c11"
                     disabled={false}
                     href=""
                     icon={true}
@@ -5014,28 +5078,28 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                     type="button"
                   >
                     <div
-                      className="c43"
+                      className="c44"
                     >
                       <svg
                         height="10"
                         width="28"
                       >
                         <rect
-                          className="c44"
+                          className="c45"
                           height="6"
                           width="6"
                           x="2"
                           y="2"
                         />
                         <rect
-                          className="c45"
+                          className="c46"
                           height="6"
                           width="6"
                           x="11"
                           y="2"
                         />
                         <rect
-                          className="c46"
+                          className="c47"
                           height="6"
                           width="6"
                           x="20"
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap
index 8df82fed..6f0fe6aa 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap
@@ -482,11 +482,11 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c31 {
+.c32 {
   margin-top: 0.375rem;
 }
 
-.c38 {
+.c39 {
   margin-top: 1.5rem;
   margin-bottom: 1.5rem;
 }
@@ -627,7 +627,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c34 {
+.c35 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -672,7 +672,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   margin: 0;
 }
 
-.c34:focus {
+.c35:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -680,43 +680,43 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c34:hover {
+.c35:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c34:active,
-.c34:active:hover,
-.c34:active:focus {
+.c35:active,
+.c35:active:hover,
+.c35:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c34[disabled] {
+.c35[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c34:focus {
+.c35:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c34:hover {
+.c35:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c34:active,
-.c34:active:hover,
-.c34:active:focus {
+.c35:active,
+.c35:active:hover,
+.c35:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c35 {
+.c36 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -762,7 +762,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   margin: 0;
 }
 
-.c35:focus {
+.c36:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -770,43 +770,43 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c35:hover {
+.c36:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c35:active,
-.c35:active:hover,
-.c35:active:focus {
+.c36:active,
+.c36:active:hover,
+.c36:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c35[disabled] {
+.c36[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c35:focus {
+.c36:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c35:hover {
+.c36:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c35:active,
-.c35:active:hover,
-.c35:active:focus {
+.c36:active,
+.c36:active:hover,
+.c36:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c37 {
+.c38 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -864,7 +864,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   float: right;
 }
 
-.c37:focus {
+.c38:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -872,66 +872,66 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c37:hover {
+.c38:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c37[disabled] {
+.c38[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c37:focus {
+.c38:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c37:hover {
+.c38:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c37:focus {
+.c38:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c37:hover {
+.c38:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c37 svg + span {
+.c38 svg + span {
   margin-left: 0.75rem;
 }
 
-.c37 svg {
+.c38 svg {
   max-height: 1.125rem;
 }
 
@@ -950,6 +950,22 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c30 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c0 {
   margin-right: auto;
   margin-left: auto;
@@ -978,7 +994,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c32 {
+.c33 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1007,7 +1023,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   display: block;
 }
 
-.c33 {
+.c34 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1017,7 +1033,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   display: block;
 }
 
-.c36 {
+.c37 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1027,7 +1043,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   display: block;
 }
 
-.c39 {
+.c40 {
   color: rgba(73,73,73,1);
   font-weight: normal;
   line-height: 1.625rem;
@@ -1035,16 +1051,16 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   margin: 0;
 }
 
-.c39 + p,
-.c39 + small,
-.c39 + h1,
-.c39 + h2,
-.c39 + label,
-.c39 + h3,
-.c39 + h4,
-.c39 + h5,
-.c39 + div,
-.c39 + span {
+.c40 + p,
+.c40 + small,
+.c40 + h1,
+.c40 + h2,
+.c40 + label,
+.c40 + h3,
+.c40 + h4,
+.c40 + h5,
+.c40 + div,
+.c40 + span {
   margin-top: 1.5rem;
 }
 
@@ -1210,7 +1226,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c30 {
+.c31 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -1515,7 +1531,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   max-width: 98%;
 }
 
-.c40 {
+.c41 {
   margin: 0;
   padding: 0;
   display: -webkit-box;
@@ -1554,7 +1570,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c32 {
+  .c33 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -1563,7 +1579,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c32 {
+  .c33 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -1581,7 +1597,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c33 {
+  .c34 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -1590,7 +1606,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c36 {
+  .c37 {
     display: none;
   }
 }
@@ -1742,13 +1758,17 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
                   >
                     <div
                       className="c29"
-                    />
+                    >
+                      <label
+                        className="c30"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
             </div>
             <div
-              className="c30"
+              className="c31"
             />
             <div
               className="c27"
@@ -1780,23 +1800,27 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
                   >
                     <div
                       className="c29"
-                    />
+                    >
+                      <label
+                        className="c30"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c31"
+            className="c32"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <button
-                  className="c34 c10 c11"
+                  className="c35 c10 c11"
                   disabled={false}
                   href=""
                   onClick={[Function]}
@@ -1807,7 +1831,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
                   </span>
                 </button>
                 <button
-                  className="c35 c10 c11"
+                  className="c36 c10 c11"
                   disabled={true}
                   href=""
                   type="submit"
@@ -1818,10 +1842,10 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
                 </button>
               </div>
               <div
-                className="c36"
+                className="c37"
               >
                 <button
-                  className="c37 c10 c11"
+                  className="c38 c10 c11"
                   disabled={false}
                   href=""
                   icon={true}
@@ -1858,10 +1882,10 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
     </div>
   </form>
   <div
-    className="c38"
+    className="c39"
   >
     <h3
-      className="c39"
+      className="c40"
     >
       0
        tag
@@ -1869,7 +1893,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
     </h3>
   </div>
   <ul
-    className="c40"
+    className="c41"
   />
 </div>
 `;
@@ -2356,11 +2380,11 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c31 {
+.c32 {
   margin-top: 0.375rem;
 }
 
-.c38 {
+.c39 {
   margin-top: 1.5rem;
   margin-bottom: 1.5rem;
 }
@@ -2416,7 +2440,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
-.c34 {
+.c35 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2461,7 +2485,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   margin: 0;
 }
 
-.c34:focus {
+.c35:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2469,43 +2493,43 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c34:hover {
+.c35:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c34:active,
-.c34:active:hover,
-.c34:active:focus {
+.c35:active,
+.c35:active:hover,
+.c35:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c34[disabled] {
+.c35[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c34:focus {
+.c35:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c34:hover {
+.c35:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c34:active,
-.c34:active:hover,
-.c34:active:focus {
+.c35:active,
+.c35:active:hover,
+.c35:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c35 {
+.c36 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2551,7 +2575,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   margin: 0;
 }
 
-.c35:focus {
+.c36:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2559,43 +2583,43 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c35:hover {
+.c36:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c35:active,
-.c35:active:hover,
-.c35:active:focus {
+.c36:active,
+.c36:active:hover,
+.c36:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c35[disabled] {
+.c36[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c35:focus {
+.c36:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c35:hover {
+.c36:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c35:active,
-.c35:active:hover,
-.c35:active:focus {
+.c36:active,
+.c36:active:hover,
+.c36:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c37 {
+.c38 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2653,7 +2677,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   float: right;
 }
 
-.c37:focus {
+.c38:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2661,66 +2685,66 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c37:hover {
+.c38:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c37[disabled] {
+.c38[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c37:focus {
+.c38:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c37:hover {
+.c38:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c37:focus {
+.c38:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c37:hover {
+.c38:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c37 svg + span {
+.c38 svg + span {
   margin-left: 0.75rem;
 }
 
-.c37 svg {
+.c38 svg {
   max-height: 1.125rem;
 }
 
@@ -2846,6 +2870,22 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c30 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c0 {
   margin-right: auto;
   margin-left: auto;
@@ -2874,7 +2914,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c32 {
+.c33 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -2903,7 +2943,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   display: block;
 }
 
-.c33 {
+.c34 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -2913,7 +2953,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   display: block;
 }
 
-.c36 {
+.c37 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -2923,7 +2963,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   display: block;
 }
 
-.c39 {
+.c40 {
   color: rgba(73,73,73,1);
   font-weight: normal;
   line-height: 1.625rem;
@@ -2931,16 +2971,16 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   margin: 0;
 }
 
-.c39 + p,
-.c39 + small,
-.c39 + h1,
-.c39 + h2,
-.c39 + label,
-.c39 + h3,
-.c39 + h4,
-.c39 + h5,
-.c39 + div,
-.c39 + span {
+.c40 + p,
+.c40 + small,
+.c40 + h1,
+.c40 + h2,
+.c40 + label,
+.c40 + h3,
+.c40 + h4,
+.c40 + h5,
+.c40 + div,
+.c40 + span {
   margin-top: 1.5rem;
 }
 
@@ -3085,7 +3125,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c30 {
+.c31 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -3401,7 +3441,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   max-width: 98%;
 }
 
-.c40 {
+.c41 {
   margin: 0;
   padding: 0;
   display: -webkit-box;
@@ -3440,7 +3480,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c32 {
+  .c33 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -3449,7 +3489,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c32 {
+  .c33 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -3467,7 +3507,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c33 {
+  .c34 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -3476,7 +3516,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c36 {
+  .c37 {
     -webkit-flex-basis: 41.66666666666667%;
     -ms-flex-preferred-size: 41.66666666666667%;
     flex-basis: 41.66666666666667%;
@@ -3655,13 +3695,17 @@ exports[`renders <Tags editing /> without throwing 1`] = `
                   >
                     <div
                       className="c29"
-                    />
+                    >
+                      <label
+                        className="c30"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
             </div>
             <div
-              className="c30"
+              className="c31"
             />
             <div
               className="c27"
@@ -3693,23 +3737,27 @@ exports[`renders <Tags editing /> without throwing 1`] = `
                   >
                     <div
                       className="c29"
-                    />
+                    >
+                      <label
+                        className="c30"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c31"
+            className="c32"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <button
-                  className="c34 c10 c11"
+                  className="c35 c10 c11"
                   disabled={false}
                   href=""
                   onClick={[Function]}
@@ -3720,7 +3768,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
                   </span>
                 </button>
                 <button
-                  className="c35 c10 c11"
+                  className="c36 c10 c11"
                   disabled={true}
                   href=""
                   type="submit"
@@ -3731,10 +3779,10 @@ exports[`renders <Tags editing /> without throwing 1`] = `
                 </button>
               </div>
               <div
-                className="c36"
+                className="c37"
               >
                 <button
-                  className="c37 c10 c11"
+                  className="c38 c10 c11"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3771,10 +3819,10 @@ exports[`renders <Tags editing /> without throwing 1`] = `
     </div>
   </form>
   <div
-    className="c38"
+    className="c39"
   >
     <h3
-      className="c39"
+      className="c40"
     >
       0
        tag
@@ -3782,7 +3830,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
     </h3>
   </div>
   <ul
-    className="c40"
+    className="c41"
   />
 </div>
 `;
@@ -3792,11 +3840,11 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   margin-top: 0.1875rem;
 }
 
-.c31 {
+.c32 {
   margin-top: 0.375rem;
 }
 
-.c42 {
+.c43 {
   margin-top: 1.5rem;
   margin-bottom: 1.5rem;
 }
@@ -3843,14 +3891,14 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
-.c39 {
+.c40 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
   animation: iCqDak 1.5s ease-out 0s infinite;
 }
 
-.c40 {
+.c41 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -3859,7 +3907,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   animation-delay: 0.5s;
 }
 
-.c41 {
+.c42 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -3868,7 +3916,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   animation-delay: 1s;
 }
 
-.c38 {
+.c39 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -3905,7 +3953,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
-.c34 {
+.c35 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3950,7 +3998,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   margin: 0;
 }
 
-.c34:focus {
+.c35:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3958,43 +4006,43 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c34:hover {
+.c35:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c34:active,
-.c34:active:hover,
-.c34:active:focus {
+.c35:active,
+.c35:active:hover,
+.c35:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c34[disabled] {
+.c35[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c34:focus {
+.c35:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c34:hover {
+.c35:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c34:active,
-.c34:active:hover,
-.c34:active:focus {
+.c35:active,
+.c35:active:hover,
+.c35:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c35 {
+.c36 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4040,7 +4088,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   margin: 0;
 }
 
-.c35:focus {
+.c36:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4048,38 +4096,38 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c35:hover {
+.c36:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c35:active,
-.c35:active:hover,
-.c35:active:focus {
+.c36:active,
+.c36:active:hover,
+.c36:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c35[disabled] {
+.c36[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c35:focus {
+.c36:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c35:hover {
+.c36:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c35:active,
-.c35:active:hover,
-.c35:active:focus {
+.c36:active,
+.c36:active:hover,
+.c36:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
@@ -4191,7 +4239,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c37 {
+.c38 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4254,7 +4302,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   float: right;
 }
 
-.c37:focus {
+.c38:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4262,83 +4310,83 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c37:hover {
+.c38:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c37[disabled] {
+.c38[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c37:focus {
+.c38:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c37:hover {
+.c38:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c37:focus {
+.c38:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c37:hover {
+.c38:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c37:focus {
+.c38:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c37:hover {
+.c38:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c37:active,
-.c37:active:hover,
-.c37:active:focus {
+.c38:active,
+.c38:active:hover,
+.c38:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c37 svg + span {
+.c38 svg + span {
   margin-left: 0.75rem;
 }
 
-.c37 svg {
+.c38 svg {
   max-height: 1.125rem;
 }
 
@@ -4357,6 +4405,22 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   font-size: 0.8125rem;
 }
 
+.c30 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-bottom: 0.1875rem;
+  float: right;
+  font-size: 0.8125rem;
+  margin-top: 0.375rem;
+  float: none;
+  width: 18.75rem;
+}
+
 .c0 {
   margin-right: auto;
   margin-left: auto;
@@ -4385,7 +4449,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c32 {
+.c33 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -4414,7 +4478,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   display: block;
 }
 
-.c33 {
+.c34 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4424,7 +4488,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   display: block;
 }
 
-.c36 {
+.c37 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4434,7 +4498,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   display: block;
 }
 
-.c43 {
+.c44 {
   color: rgba(73,73,73,1);
   font-weight: normal;
   line-height: 1.625rem;
@@ -4442,16 +4506,16 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   margin: 0;
 }
 
-.c43 + p,
-.c43 + small,
-.c43 + h1,
-.c43 + h2,
-.c43 + label,
-.c43 + h3,
-.c43 + h4,
-.c43 + h5,
-.c43 + div,
-.c43 + span {
+.c44 + p,
+.c44 + small,
+.c44 + h1,
+.c44 + h2,
+.c44 + label,
+.c44 + h3,
+.c44 + h4,
+.c44 + h5,
+.c44 + div,
+.c44 + span {
   margin-top: 1.5rem;
 }
 
@@ -4596,7 +4660,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   flex-basis: auto;
 }
 
-.c30 {
+.c31 {
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0;
@@ -4912,7 +4976,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   max-width: 98%;
 }
 
-.c44 {
+.c45 {
   margin: 0;
   padding: 0;
   display: -webkit-box;
@@ -4951,7 +5015,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c32 {
+  .c33 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -4960,7 +5024,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c32 {
+  .c33 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -4978,7 +5042,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c33 {
+  .c34 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -4987,7 +5051,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c36 {
+  .c37 {
     -webkit-flex-basis: 41.66666666666667%;
     -ms-flex-preferred-size: 41.66666666666667%;
     flex-basis: 41.66666666666667%;
@@ -5166,13 +5230,17 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
                   >
                     <div
                       className="c29"
-                    />
+                    >
+                      <label
+                        className="c30"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
             </div>
             <div
-              className="c30"
+              className="c31"
             />
             <div
               className="c27"
@@ -5204,23 +5272,27 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
                   >
                     <div
                       className="c29"
-                    />
+                    >
+                      <label
+                        className="c30"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            className="c31"
+            className="c32"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <button
-                  className="c34 c10 c11"
+                  className="c35 c10 c11"
                   disabled={false}
                   href=""
                   onClick={[Function]}
@@ -5231,7 +5303,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
                   </span>
                 </button>
                 <button
-                  className="c35 c10 c11"
+                  className="c36 c10 c11"
                   disabled={true}
                   href=""
                   type="submit"
@@ -5242,10 +5314,10 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
                 </button>
               </div>
               <div
-                className="c36"
+                className="c37"
               >
                 <button
-                  className="c37 c10 c11"
+                  className="c38 c10 c11"
                   disabled={false}
                   href=""
                   icon={true}
@@ -5253,28 +5325,28 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
                   type="button"
                 >
                   <div
-                    className="c38"
+                    className="c39"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c39"
+                        className="c40"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c40"
+                        className="c41"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c41"
+                        className="c42"
                         height="6"
                         width="6"
                         x="20"
@@ -5291,10 +5363,10 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
     </div>
   </form>
   <div
-    className="c42"
+    className="c43"
   >
     <h3
-      className="c43"
+      className="c44"
     >
       0
        tag
@@ -5302,7 +5374,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
     </h3>
   </div>
   <ul
-    className="c44"
+    className="c45"
   />
 </div>
 `;
diff --git a/packages/ui-toolkit/src/text/__tests__/__snapshots__/text.spec.js.snap b/packages/ui-toolkit/src/text/__tests__/__snapshots__/text.spec.js.snap
index a78c3f29..1ba9b3d2 100644
--- a/packages/ui-toolkit/src/text/__tests__/__snapshots__/text.spec.js.snap
+++ b/packages/ui-toolkit/src/text/__tests__/__snapshots__/text.spec.js.snap
@@ -210,3 +210,66 @@ exports[`Button Small 1`] = `
   Inspire the lazy
 </small>
 `;
+
+exports[`Button Sup 1`] = `
+.c0 {
+  position: absolute;
+  margin-top: -0.375rem;
+  border-radius: 0.1875rem;
+  font-weight: 600;
+  line-height: normal;
+  font-size: 0.5rem;
+  color: rgb(59,70,204);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+}
+
+<sup
+  className="c0"
+>
+  Inspire the lazy
+</sup>
+`;
+
+exports[`Button Sup badge 1`] = `
+.c0 {
+  position: absolute;
+  margin-top: -0.375rem;
+  border-radius: 0.1875rem;
+  font-weight: 600;
+  line-height: normal;
+  font-size: 0.5rem;
+  color: rgb(59,70,204);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  padding: 0.125rem 0.1875rem;
+  background: rgb(59,70,204);
+  color: rgb(255,255,255);
+}
+
+<sup
+  className="c0"
+>
+  Inspire the lazy
+</sup>
+`;
diff --git a/packages/ui-toolkit/src/text/__tests__/text.spec.js b/packages/ui-toolkit/src/text/__tests__/text.spec.js
index 1a336d0e..4ab3f7f7 100644
--- a/packages/ui-toolkit/src/text/__tests__/text.spec.js
+++ b/packages/ui-toolkit/src/text/__tests__/text.spec.js
@@ -3,7 +3,7 @@ import renderer from 'react-test-renderer';
 import 'jest-styled-components';
 import remcalc from 'remcalc';
 
-import { P, H1, H2, H3, H4, H5, H6, Small } from '../';
+import { P, H1, H2, H3, H4, H5, H6, Small, Sup } from '../';
 import { Theme } from '../../mocks';
 import theme from '../../theme';
 
@@ -123,4 +123,32 @@ describe('Button', () => {
     expect(tree).toHaveStyleRule('color', theme.text.replace(/ /g, ''));
     expect(tree).toHaveStyleRule('font-size', remcalc(13));
   });
+
+  test('Sup', () => {
+    const tree = renderer
+      .create(
+        <Theme>
+          <Sup>Inspire the lazy</Sup>
+        </Theme>
+      )
+      .toJSON();
+
+    expect(tree).toMatchSnapshot();
+    expect(tree).toHaveStyleRule('color', theme.primary.replace(/ /g, ''));
+    expect(tree).toHaveStyleRule('font-size', remcalc(8));
+  });
+
+  test('Sup badge', () => {
+    const tree = renderer
+      .create(
+        <Theme>
+          <Sup badge>Inspire the lazy</Sup>
+        </Theme>
+      )
+      .toJSON();
+
+    expect(tree).toMatchSnapshot();
+    expect(tree).toHaveStyleRule('color', theme.white.replace(/ /g, ''));
+    expect(tree).toHaveStyleRule('font-size', remcalc(8));
+  });
 });
diff --git a/packages/ui-toolkit/src/text/sup.js b/packages/ui-toolkit/src/text/sup.js
index da3f398f..b70a5887 100644
--- a/packages/ui-toolkit/src/text/sup.js
+++ b/packages/ui-toolkit/src/text/sup.js
@@ -4,7 +4,7 @@ import is from 'styled-is';
 
 export default styled.sup`
   position: absolute;
-  margin-top: ${remcalc(-20)};
+  margin-top: ${remcalc(-6)};
   border-radius: ${remcalc(3)};
   font-weight: ${props => props.theme.font.weight.semibold};
   line-height: normal;