diff --git a/packages/my-joy-instances/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png b/packages/my-joy-instances/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png
index 41b7d996..82280156 100644
Binary files a/packages/my-joy-instances/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png and b/packages/my-joy-instances/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png differ
diff --git a/packages/my-joy-instances/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap b/packages/my-joy-instances/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap
index 5342425b..28a03158 100644
--- a/packages/my-joy-instances/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap
+++ b/packages/my-joy-instances/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap
@@ -39,7 +39,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -78,7 +78,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   display: block;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -88,7 +88,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   display: block;
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -98,7 +98,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   display: block;
 }
 
-.c30 {
+.c31 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -113,11 +113,11 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-bottom: 1.125rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.375rem;
 }
 
-.c28 {
+.c29 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -126,18 +126,18 @@ exports[`renders <Summary /> without throwing 1`] = `
   padding: 1.5rem;
 }
 
-.c21 {
+.c22 {
   padding-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   background-color: transparent;
   -webkit-text-decoration-skip: objects;
   text-decoration-skip: objects;
   font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
 
-.c23 {
+.c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -150,52 +150,52 @@ exports[`renders <Summary /> without throwing 1`] = `
   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;
 }
 
-.c19 {
+.c20 {
   color: rgb(59,70,204);
   -webkit-text-fill-color: currentcolor;
   color: rgb(255,255,255);
   -webkit-text-fill-color: currentcolor;
 }
 
-.c19:hover {
+.c20:hover {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c34 {
+.c35 {
   cursor: pointer;
 }
 
-.c18 {
+.c19 {
   display: inline-block;
 }
 
-.c18 + button,
-.c18 + a {
+.c19 + button,
+.c19 + a {
   margin-left: 0.375rem;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -253,7 +253,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -261,51 +261,51 @@ exports[`renders <Summary /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -367,7 +367,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   align-items: center;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -375,68 +375,68 @@ exports[`renders <Summary /> 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);
 }
 
-.c22 svg + span {
+.c23 svg + span {
   margin-left: 0.75rem;
 }
 
-.c22 svg {
+.c23 svg {
   max-height: 1.125rem;
 }
 
-.c24 {
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -494,7 +494,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c24:focus {
+.c25:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -502,219 +502,64 @@ exports[`renders <Summary /> without throwing 1`] = `
   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(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.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);
 }
 
-.c24 svg + span {
+.c25 svg + span {
   margin-left: 0.75rem;
 }
 
-.c24 svg {
-  max-height: 1.125rem;
-}
-
-.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);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  min-height: 0rem;
-  height: auto;
-  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;
-  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: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);
-}
-
-.c26 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c26 svg {
+.c25 svg {
   max-height: 1.125rem;
 }
 
@@ -769,6 +614,11 @@ exports[`renders <Summary /> without throwing 1`] = `
   color: rgb(216,216,216);
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
+  padding: 0.625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  min-height: 0rem;
+  height: auto;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -777,7 +627,6 @@ exports[`renders <Summary /> without throwing 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
   float: right;
 }
 
@@ -869,7 +718,158 @@ exports[`renders <Summary /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c10 {
+.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);
+  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;
+  font-weight: 500;
+  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:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c28:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c28 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c28 svg {
+  max-height: 1.125rem;
+}
+
+.c11 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -880,7 +880,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-bottom: 0.1875rem;
 }
 
-.c31 {
+.c32 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -916,13 +916,13 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c29 {
+.c30 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.9375rem;
   height: 0.9375rem;
   border-radius: 50%;
@@ -997,7 +997,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c33 {
+.c34 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -1021,62 +1021,62 @@ exports[`renders <Summary /> without throwing 1`] = `
   text-overflow: ellipsis;
 }
 
-.c33:focus {
+.c34:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c33::-webkit-input-placeholder {
+.c34::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33::-moz-placeholder {
+.c34::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:-ms-input-placeholder {
+.c34:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:invalid {
+.c34:invalid {
   box-shadow: none;
 }
 
-.c33:disabled {
+.c34:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c33:disabled::-webkit-input-placeholder {
+.c34:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled::-moz-placeholder {
+.c34:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled:-ms-input-placeholder {
+.c34:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled {
+.c34:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled::-webkit-input-placeholder {
+.c34:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled::-moz-placeholder {
+.c34:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled:-ms-input-placeholder {
+.c34:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35 {
+.c36 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -1099,62 +1099,62 @@ exports[`renders <Summary /> without throwing 1`] = `
   min-width: 100%;
 }
 
-.c35:focus {
+.c36:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c35::-webkit-input-placeholder {
+.c36::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35::-moz-placeholder {
+.c36::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:-ms-input-placeholder {
+.c36:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:invalid {
+.c36:invalid {
   box-shadow: none;
 }
 
-.c35:disabled {
+.c36:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled {
+.c36:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32 {
+.c33 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1166,20 +1166,26 @@ exports[`renders <Summary /> without throwing 1`] = `
   align-items: center;
 }
 
-.c32 input {
+.c33 input {
   padding-right: 1.875rem;
 }
 
-.c32 div {
+.c33 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
 
+.c10 {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
 .c9 {
   -webkit-align-items: center;
   -webkit-box-align: center;
@@ -1195,7 +1201,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   justify-content: flex-start;
 }
 
-.c11 {
+.c12 {
   width: 0.0625rem;
   background: rgb(216,216,216);
   height: 1.5rem;
@@ -1219,7 +1225,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -1264,7 +1270,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -1273,7 +1279,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c25 {
+  .c26 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -1282,7 +1288,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c30 {
+  .c31 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -1291,7 +1297,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c30 {
+  .c31 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -1306,7 +1312,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media (max-width:47.9375rem) {
-  .c11 {
+  .c12 {
     display: none;
   }
 }
@@ -1347,32 +1353,32 @@ exports[`renders <Summary /> without throwing 1`] = `
               className="c9"
             >
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Custom Image
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Hardware virtual machine
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               />
               <div
-                className="c11"
+                className="c12"
               />
               <div
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c13"
                   color={undefined}
                   size="0.9375rem"
                 />
@@ -1380,7 +1386,7 @@ exports[`renders <Summary /> without throwing 1`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -1389,12 +1395,12 @@ exports[`renders <Summary /> without throwing 1`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Created: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -1402,18 +1408,18 @@ exports[`renders <Summary /> without throwing 1`] = `
                   </label>
                 </div>
                 <div
-                  className="c11"
+                  className="c12"
                 />
                 <div
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Updated: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -1424,20 +1430,20 @@ exports[`renders <Summary /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <a
-                className="c17 c18 c19 c20"
+                className="c18 c19 c20 c21"
                 href="http://localhost:3070/~create/undefined"
                 icon={true}
                 rel="noopener noreferrer"
                 target="__blank"
               >
                 <div
-                  className="c21"
+                  className="c22"
                 >
                   <svg
                     className=""
@@ -1464,7 +1470,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1496,7 +1502,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c23"
+                  className="c25 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1531,7 +1537,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1563,7 +1569,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c23"
+                  className="c25 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1598,7 +1604,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1646,7 +1652,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c23"
+                  className="c25 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1694,14 +1700,14 @@ exports[`renders <Summary /> without throwing 1`] = `
               </span>
             </div>
             <div
-              className="c25"
+              className="c26"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c26 c18 c23"
+                  className="c27 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1733,7 +1739,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c27 c18 c23"
+                  className="c28 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1766,10 +1772,10 @@ exports[`renders <Summary /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c28"
+            className="c29"
           >
             <div
-              className="c29 c0"
+              className="c30 c0"
               height="0.0625rem"
             />
           </div>
@@ -1777,19 +1783,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c33"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -1802,7 +1808,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c34"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -1828,19 +1834,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c33"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -1853,7 +1859,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c34"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -1879,19 +1885,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c33"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -1904,7 +1910,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c34"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -1930,19 +1936,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -1955,7 +1961,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c34"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -2023,7 +2029,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -2062,7 +2068,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   display: block;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -2072,7 +2078,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   display: block;
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -2082,7 +2088,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   display: block;
 }
 
-.c32 {
+.c33 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -2097,11 +2103,11 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-bottom: 1.125rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.375rem;
 }
 
-.c30 {
+.c31 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -2110,18 +2116,18 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   padding: 1.5rem;
 }
 
-.c21 {
+.c22 {
   padding-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   background-color: transparent;
   -webkit-text-decoration-skip: objects;
   text-decoration-skip: objects;
   font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
 
-.c23 {
+.c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -2134,52 +2140,52 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   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;
 }
 
-.c19 {
+.c20 {
   color: rgb(59,70,204);
   -webkit-text-fill-color: currentcolor;
   color: rgb(255,255,255);
   -webkit-text-fill-color: currentcolor;
 }
 
-.c19:hover {
+.c20:hover {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c36 {
+.c37 {
   cursor: pointer;
 }
 
-.c18 {
+.c19 {
   display: inline-block;
 }
 
-.c18 + button,
-.c18 + a {
+.c19 + button,
+.c19 + a {
   margin-left: 0.375rem;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2237,7 +2243,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2245,51 +2251,51 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2351,7 +2357,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   align-items: center;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2359,191 +2365,64 @@ exports[`renders <Summary instance /> 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);
 }
 
-.c22 svg + span {
+.c23 svg + span {
   margin-left: 0.75rem;
 }
 
-.c22 svg {
-  max-height: 1.125rem;
-}
-
-.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);
-  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;
-  font-weight: 500;
-}
-
-.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);
-}
-
-.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);
-}
-
-.c24 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c24 svg {
+.c23 svg {
   max-height: 1.125rem;
 }
 
@@ -2589,11 +2468,11 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
-  padding: 0.625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  min-height: 0rem;
-  height: auto;
+  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;
@@ -2602,6 +2481,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
+  font-weight: 500;
 }
 
 .c25:focus {
@@ -2648,6 +2528,23 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   border-color: rgb(216,216,216);
 }
 
+.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);
+}
+
 .c25 svg + span {
   margin-left: 0.75rem;
 }
@@ -2698,6 +2595,11 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
+  padding: 0.625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  min-height: 0rem;
+  height: auto;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -2706,7 +2608,6 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
 }
 
 .c26:focus {
@@ -2761,7 +2662,112 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c28 {
+.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);
+  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;
+  font-weight: 500;
+}
+
+.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 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c27 svg {
+  max-height: 1.125rem;
+}
+
+.c29 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2823,135 +2829,6 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   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;
-}
-
-.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;
-  font-weight: 500;
-  float: right;
-}
-
 .c29:focus {
   outline: 0;
   -webkit-text-decoration: none;
@@ -3023,7 +2900,136 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c10 {
+.c30 {
+  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;
+  font-weight: 500;
+  float: right;
+}
+
+.c30:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c30:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c30[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c30:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c30:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c30:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c30:hover {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c30 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c30 svg {
+  max-height: 1.125rem;
+}
+
+.c11 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -3034,7 +3040,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-bottom: 0.1875rem;
 }
 
-.c33 {
+.c34 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -3070,13 +3076,13 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c31 {
+.c32 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.9375rem;
   height: 0.9375rem;
   border-radius: 50%;
@@ -3152,7 +3158,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c35 {
+.c36 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -3175,62 +3181,62 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   min-width: 100%;
 }
 
-.c35:focus {
+.c36:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c35::-webkit-input-placeholder {
+.c36::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35::-moz-placeholder {
+.c36::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:-ms-input-placeholder {
+.c36:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:invalid {
+.c36:invalid {
   box-shadow: none;
 }
 
-.c35:disabled {
+.c36:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled {
+.c36:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c34 {
+.c35 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -3242,16 +3248,16 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   align-items: center;
 }
 
-.c34 input {
+.c35 input {
   padding-right: 1.875rem;
 }
 
-.c34 div {
+.c35 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c37 {
+.c38 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -3264,20 +3270,26 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-bottom: 0rem;
 }
 
-.c37 input {
+.c38 input {
   padding-right: 1.875rem;
 }
 
-.c37 div {
+.c38 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
 
+.c10 {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
 .c9 {
   -webkit-align-items: center;
   -webkit-box-align: center;
@@ -3293,7 +3305,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   justify-content: flex-start;
 }
 
-.c11 {
+.c12 {
   width: 0.0625rem;
   background: rgb(216,216,216);
   height: 1.5rem;
@@ -3317,7 +3329,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -3362,7 +3374,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -3371,7 +3383,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c27 {
+  .c28 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -3380,7 +3392,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c32 {
+  .c33 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -3389,7 +3401,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c32 {
+  .c33 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -3404,7 +3416,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media (max-width:47.9375rem) {
-  .c11 {
+  .c12 {
     display: none;
   }
 }
@@ -3445,34 +3457,34 @@ exports[`renders <Summary instance /> without throwing 1`] = `
               className="c9"
             >
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Alpine 3
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Hardware virtual machine
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               >
                 g4-highcpu-128M
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <div
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c13"
                   color="green"
                   size="0.9375rem"
                 />
@@ -3480,7 +3492,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -3489,12 +3501,12 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Created: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -3502,18 +3514,18 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   </label>
                 </div>
                 <div
-                  className="c11"
+                  className="c12"
                 />
                 <div
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Updated: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -3524,20 +3536,20 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <a
-                className="c17 c18 c19 c20"
+                className="c18 c19 c20 c21"
                 href="http://localhost:3070/~create/undefined"
                 icon={true}
                 rel="noopener noreferrer"
                 target="__blank"
               >
                 <div
-                  className="c21"
+                  className="c22"
                 >
                   <svg
                     className=""
@@ -3564,7 +3576,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -3596,7 +3608,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c23"
+                  className="c25 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -3631,7 +3643,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c25 c18 c23"
+                  className="c26 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3663,7 +3675,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c26 c18 c23"
+                  className="c27 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3698,7 +3710,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c25 c18 c23"
+                  className="c26 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3746,7 +3758,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c26 c18 c23"
+                  className="c27 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3794,14 +3806,14 @@ exports[`renders <Summary instance /> without throwing 1`] = `
               </span>
             </div>
             <div
-              className="c27"
+              className="c28"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c28 c18 c23"
+                  className="c29 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3833,7 +3845,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c29 c18 c23"
+                  className="c30 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3866,10 +3878,10 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c30"
+            className="c31"
           >
             <div
-              className="c31 c0"
+              className="c32 c0"
               height="0.0625rem"
             />
           </div>
@@ -3877,19 +3889,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -3902,7 +3914,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -3928,19 +3940,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -3953,7 +3965,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -3979,19 +3991,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -4004,7 +4016,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -4030,19 +4042,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Image UUID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -4055,7 +4067,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -4081,19 +4093,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -4106,7 +4118,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -4132,19 +4144,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Public IP address 1
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -4157,7 +4169,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -4183,19 +4195,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Public IP address 2
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -4208,7 +4220,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -4234,19 +4246,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Private IP address 1
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -4259,7 +4271,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -4285,19 +4297,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Private IP address 2
               </label>
               <div
-                className="c37"
+                className="c38"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -4310,7 +4322,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -4378,7 +4390,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-left: -0.625rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -4417,7 +4429,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   display: block;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4427,7 +4439,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   display: block;
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4437,7 +4449,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   display: block;
 }
 
-.c32 {
+.c33 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4452,11 +4464,11 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-bottom: 1.125rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.375rem;
 }
 
-.c30 {
+.c31 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -4465,18 +4477,18 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   padding: 1.5rem;
 }
 
-.c21 {
+.c22 {
   padding-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   background-color: transparent;
   -webkit-text-decoration-skip: objects;
   text-decoration-skip: objects;
   font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
 
-.c23 {
+.c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -4489,52 +4501,52 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   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;
 }
 
-.c19 {
+.c20 {
   color: rgb(59,70,204);
   -webkit-text-fill-color: currentcolor;
   color: rgb(255,255,255);
   -webkit-text-fill-color: currentcolor;
 }
 
-.c19:hover {
+.c20:hover {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c36 {
+.c37 {
   cursor: pointer;
 }
 
-.c18 {
+.c19 {
   display: inline-block;
 }
 
-.c18 + button,
-.c18 + a {
+.c19 + button,
+.c19 + a {
   margin-left: 0.375rem;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4592,7 +4604,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   font-weight: 500;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4600,51 +4612,51 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4706,7 +4718,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   align-items: center;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4714,191 +4726,64 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   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);
 }
 
-.c22 svg + span {
+.c23 svg + span {
   margin-left: 0.75rem;
 }
 
-.c22 svg {
-  max-height: 1.125rem;
-}
-
-.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);
-  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;
-  font-weight: 500;
-}
-
-.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);
-}
-
-.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);
-}
-
-.c24 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c24 svg {
+.c23 svg {
   max-height: 1.125rem;
 }
 
@@ -4944,11 +4829,11 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
-  padding: 0.625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  min-height: 0rem;
-  height: auto;
+  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;
@@ -4957,6 +4842,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
+  font-weight: 500;
 }
 
 .c25:focus {
@@ -5003,6 +4889,23 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   border-color: rgb(216,216,216);
 }
 
+.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);
+}
+
 .c25 svg + span {
   margin-left: 0.75rem;
 }
@@ -5053,6 +4956,11 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
+  padding: 0.625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  min-height: 0rem;
+  height: auto;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -5061,7 +4969,6 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
 }
 
 .c26:focus {
@@ -5116,7 +5023,112 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   max-height: 1.125rem;
 }
 
-.c28 {
+.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);
+  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;
+  font-weight: 500;
+}
+
+.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 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c27 svg {
+  max-height: 1.125rem;
+}
+
+.c29 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -5178,135 +5190,6 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   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;
-}
-
-.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;
-  font-weight: 500;
-  float: right;
-}
-
 .c29:focus {
   outline: 0;
   -webkit-text-decoration: none;
@@ -5378,7 +5261,136 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   max-height: 1.125rem;
 }
 
-.c10 {
+.c30 {
+  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;
+  font-weight: 500;
+  float: right;
+}
+
+.c30:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c30:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c30[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c30:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c30:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c30:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c30:hover {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c30 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c30 svg {
+  max-height: 1.125rem;
+}
+
+.c11 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -5389,7 +5401,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-bottom: 0.1875rem;
 }
 
-.c33 {
+.c34 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -5425,13 +5437,13 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-top: 1.5rem;
 }
 
-.c31 {
+.c32 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.9375rem;
   height: 0.9375rem;
   border-radius: 50%;
@@ -5507,7 +5519,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c35 {
+.c36 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -5530,62 +5542,62 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   min-width: 100%;
 }
 
-.c35:focus {
+.c36:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c35::-webkit-input-placeholder {
+.c36::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35::-moz-placeholder {
+.c36::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:-ms-input-placeholder {
+.c36:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:invalid {
+.c36:invalid {
   box-shadow: none;
 }
 
-.c35:disabled {
+.c36:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled {
+.c36:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c34 {
+.c35 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -5597,16 +5609,16 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   align-items: center;
 }
 
-.c34 input {
+.c35 input {
   padding-right: 1.875rem;
 }
 
-.c34 div {
+.c35 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c37 {
+.c38 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -5619,20 +5631,26 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-bottom: 0rem;
 }
 
-.c37 input {
+.c38 input {
   padding-right: 1.875rem;
 }
 
-.c37 div {
+.c38 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
 
+.c10 {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
 .c9 {
   -webkit-align-items: center;
   -webkit-box-align: center;
@@ -5648,7 +5666,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   justify-content: flex-start;
 }
 
-.c11 {
+.c12 {
   width: 0.0625rem;
   background: rgb(216,216,216);
   height: 1.5rem;
@@ -5672,7 +5690,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -5717,7 +5735,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -5726,7 +5744,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c27 {
+  .c28 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -5735,7 +5753,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c32 {
+  .c33 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -5744,7 +5762,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c32 {
+  .c33 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -5759,7 +5777,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media (max-width:47.9375rem) {
-  .c11 {
+  .c12 {
     display: none;
   }
 }
@@ -5800,34 +5818,34 @@ exports[`renders <Summary instance /> without throwing 2`] = `
               className="c9"
             >
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Custom Image
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Infrastructure container
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               >
                 g4-highcpu-128M
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <div
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c13"
                   color="green"
                   size="0.9375rem"
                 />
@@ -5835,7 +5853,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -5844,12 +5862,12 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Created: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -5857,18 +5875,18 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   </label>
                 </div>
                 <div
-                  className="c11"
+                  className="c12"
                 />
                 <div
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Updated: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -5879,20 +5897,20 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <a
-                className="c17 c18 c19 c20"
+                className="c18 c19 c20 c21"
                 href="http://localhost:3070/~create/undefined"
                 icon={true}
                 rel="noopener noreferrer"
                 target="__blank"
               >
                 <div
-                  className="c21"
+                  className="c22"
                 >
                   <svg
                     className=""
@@ -5919,7 +5937,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -5951,7 +5969,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c23"
+                  className="c25 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -5986,7 +6004,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c25 c18 c23"
+                  className="c26 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -6018,7 +6036,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c26 c18 c23"
+                  className="c27 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -6053,7 +6071,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c25 c18 c23"
+                  className="c26 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -6101,7 +6119,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c26 c18 c23"
+                  className="c27 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -6149,14 +6167,14 @@ exports[`renders <Summary instance /> without throwing 2`] = `
               </span>
             </div>
             <div
-              className="c27"
+              className="c28"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c28 c18 c23"
+                  className="c29 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -6188,7 +6206,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c29 c18 c23"
+                  className="c30 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -6221,10 +6239,10 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             </div>
           </div>
           <div
-            className="c30"
+            className="c31"
           >
             <div
-              className="c31 c0"
+              className="c32 c0"
               height="0.0625rem"
             />
           </div>
@@ -6232,19 +6250,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -6257,7 +6275,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -6283,19 +6301,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -6308,7 +6326,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -6334,19 +6352,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -6359,7 +6377,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -6385,19 +6403,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Image UUID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -6410,7 +6428,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -6436,19 +6454,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -6461,7 +6479,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -6487,19 +6505,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Public IP address 1
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -6512,7 +6530,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -6538,19 +6556,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Public IP address 2
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -6563,7 +6581,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -6589,19 +6607,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Private IP address 1
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -6614,7 +6632,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -6640,19 +6658,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Private IP address 2
               </label>
               <div
-                className="c37"
+                className="c38"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -6665,7 +6683,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -6733,7 +6751,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-left: -0.625rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -6772,7 +6790,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -6782,7 +6800,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c29 {
+.c30 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -6792,7 +6810,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c34 {
+.c35 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -6807,11 +6825,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 1.125rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.375rem;
 }
 
-.c32 {
+.c33 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -6820,18 +6838,18 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding: 1.5rem;
 }
 
-.c21 {
+.c22 {
   padding-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   background-color: transparent;
   -webkit-text-decoration-skip: objects;
   text-decoration-skip: objects;
   font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
 
-.c23 {
+.c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -6844,50 +6862,50 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   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;
 }
 
-.c19 {
+.c20 {
   color: rgb(59,70,204);
   -webkit-text-fill-color: currentcolor;
   color: rgb(255,255,255);
   -webkit-text-fill-color: currentcolor;
 }
 
-.c19:hover {
+.c20:hover {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c38 {
+.c39 {
   cursor: pointer;
 }
 
-.c25 {
+.c26 {
   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;
 }
 
-.c26 {
+.c27 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -6896,7 +6914,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   animation-delay: 0.5s;
 }
 
-.c27 {
+.c28 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -6905,7 +6923,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   animation-delay: 1s;
 }
 
-.c24 {
+.c25 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -6933,16 +6951,16 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   flex: 1 0 auto;
 }
 
-.c18 {
+.c19 {
   display: inline-block;
 }
 
-.c18 + button,
-.c18 + a {
+.c19 + button,
+.c19 + a {
   margin-left: 0.375rem;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -7000,7 +7018,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   font-weight: 500;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -7008,51 +7026,51 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -7114,7 +7132,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -7122,68 +7140,68 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   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);
 }
 
-.c22 svg + span {
+.c23 svg + span {
   margin-left: 0.75rem;
 }
 
-.c22 svg {
+.c23 svg {
   max-height: 1.125rem;
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -7241,7 +7259,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   font-weight: 500;
 }
 
-.c28:focus {
+.c29:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -7249,219 +7267,64 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   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 {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c28:hover {
+.c29:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c28 svg + span {
+.c29 svg + span {
   margin-left: 0.75rem;
 }
 
-.c28 svg {
-  max-height: 1.125rem;
-}
-
-.c30 {
-  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);
-  padding: 0.625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  min-height: 0rem;
-  height: auto;
-  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;
-  float: right;
-}
-
-.c30:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c30:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c30:active,
-.c30:active:hover,
-.c30:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c30[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c30:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c30:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c30:active,
-.c30:active:hover,
-.c30:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c30:focus {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c30:hover {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c30:active,
-.c30:active:hover,
-.c30:active:focus {
-  background-color: rgba(210,67,58,0.1);
-  border-color: rgb(205,37,27);
-}
-
-.c30:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c30:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c30:active,
-.c30:active:hover,
-.c30:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c30 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c30 svg {
+.c29 svg {
   max-height: 1.125rem;
 }
 
@@ -7516,6 +7379,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   color: rgb(216,216,216);
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
+  padding: 0.625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  min-height: 0rem;
+  height: auto;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -7524,7 +7392,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
   float: right;
 }
 
@@ -7616,7 +7483,158 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
-.c10 {
+.c32 {
+  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;
+  font-weight: 500;
+  float: right;
+}
+
+.c32:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c32:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.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);
+}
+
+.c32[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c32:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c32:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c32:active,
+.c32:active:hover,
+.c32:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c32:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c32:hover {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c32:active,
+.c32:active:hover,
+.c32:active:focus {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c32:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c32:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c32:active,
+.c32:active:hover,
+.c32:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c32 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c32 svg {
+  max-height: 1.125rem;
+}
+
+.c11 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -7627,7 +7645,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0.1875rem;
 }
 
-.c35 {
+.c36 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -7663,13 +7681,13 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-top: 1.5rem;
 }
 
-.c33 {
+.c34 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.9375rem;
   height: 0.9375rem;
   border-radius: 50%;
@@ -7744,7 +7762,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0.4375rem;
 }
 
-.c37 {
+.c38 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -7768,62 +7786,62 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   text-overflow: ellipsis;
 }
 
-.c37:focus {
+.c38:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c37::-webkit-input-placeholder {
+.c38::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37::-moz-placeholder {
+.c38::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:-ms-input-placeholder {
+.c38:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:invalid {
+.c38:invalid {
   box-shadow: none;
 }
 
-.c37:disabled {
+.c38:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c37:disabled::-webkit-input-placeholder {
+.c38:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:disabled::-moz-placeholder {
+.c38:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:disabled:-ms-input-placeholder {
+.c38:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:disabled {
+.c38:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c37:disabled::-webkit-input-placeholder {
+.c38:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c37:disabled::-moz-placeholder {
+.c38:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c37:disabled:-ms-input-placeholder {
+.c38:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c39 {
+.c40 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -7846,62 +7864,62 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   min-width: 100%;
 }
 
-.c39:focus {
+.c40:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c39::-webkit-input-placeholder {
+.c40::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c39::-moz-placeholder {
+.c40::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c39:-ms-input-placeholder {
+.c40:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c39:invalid {
+.c40:invalid {
   box-shadow: none;
 }
 
-.c39:disabled {
+.c40:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c39:disabled::-webkit-input-placeholder {
+.c40:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c39:disabled::-moz-placeholder {
+.c40:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c39:disabled:-ms-input-placeholder {
+.c40:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c39:disabled {
+.c40:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c39:disabled::-webkit-input-placeholder {
+.c40:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c39:disabled::-moz-placeholder {
+.c40:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c39:disabled:-ms-input-placeholder {
+.c40:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c36 {
+.c37 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -7913,20 +7931,26 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c36 input {
+.c37 input {
   padding-right: 1.875rem;
 }
 
-.c36 div {
+.c37 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
 
+.c10 {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
 .c9 {
   -webkit-align-items: center;
   -webkit-box-align: center;
@@ -7942,7 +7966,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   justify-content: flex-start;
 }
 
-.c11 {
+.c12 {
   width: 0.0625rem;
   background: rgb(216,216,216);
   height: 1.5rem;
@@ -7966,7 +7990,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -8011,7 +8035,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -8020,7 +8044,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c29 {
+  .c30 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -8029,7 +8053,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c34 {
+  .c35 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -8038,7 +8062,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:64em) {
-  .c34 {
+  .c35 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -8053,7 +8077,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media (max-width:47.9375rem) {
-  .c11 {
+  .c12 {
     display: none;
   }
 }
@@ -8094,32 +8118,32 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c9"
             >
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Custom Image
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Hardware virtual machine
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               />
               <div
-                className="c11"
+                className="c12"
               />
               <div
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c13"
                   color={undefined}
                   size="0.9375rem"
                 />
@@ -8127,7 +8151,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -8136,12 +8160,12 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Created: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -8149,18 +8173,18 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   </label>
                 </div>
                 <div
-                  className="c11"
+                  className="c12"
                 />
                 <div
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Updated: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -8171,20 +8195,20 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <a
-                className="c17 c18 c19 c20"
+                className="c18 c19 c20 c21"
                 href="http://localhost:3070/~create/undefined"
                 icon={true}
                 rel="noopener noreferrer"
                 target="__blank"
               >
                 <div
-                  className="c21"
+                  className="c22"
                 >
                   <svg
                     className=""
@@ -8211,7 +8235,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8219,28 +8243,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c24"
+                    className="c25"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c25"
+                        className="c26"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c26"
+                        className="c27"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c27"
+                        className="c28"
                         height="6"
                         width="6"
                         x="20"
@@ -8255,7 +8279,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c28 c18 c23"
+                  className="c29 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8263,28 +8287,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c24"
+                    className="c25"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c25"
+                        className="c26"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c26"
+                        className="c27"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c27"
+                        className="c28"
                         height="6"
                         width="6"
                         x="20"
@@ -8299,7 +8323,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8307,28 +8331,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c24"
+                    className="c25"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c25"
+                        className="c26"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c26"
+                        className="c27"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c27"
+                        className="c28"
                         height="6"
                         width="6"
                         x="20"
@@ -8343,7 +8367,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c28 c18 c23"
+                  className="c29 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8351,28 +8375,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c24"
+                    className="c25"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c25"
+                        className="c26"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c26"
+                        className="c27"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c27"
+                        className="c28"
                         height="6"
                         width="6"
                         x="20"
@@ -8387,7 +8411,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8395,28 +8419,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c24"
+                    className="c25"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c25"
+                        className="c26"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c26"
+                        className="c27"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c27"
+                        className="c28"
                         height="6"
                         width="6"
                         x="20"
@@ -8431,7 +8455,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c28 c18 c23"
+                  className="c29 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8439,28 +8463,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c24"
+                    className="c25"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c25"
+                        className="c26"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c26"
+                        className="c27"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c27"
+                        className="c28"
                         height="6"
                         width="6"
                         x="20"
@@ -8472,14 +8496,14 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </span>
             </div>
             <div
-              className="c29"
+              className="c30"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c30 c18 c23"
+                  className="c31 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8487,28 +8511,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c24"
+                    className="c25"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c25"
+                        className="c26"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c26"
+                        className="c27"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c27"
+                        className="c28"
                         height="6"
                         width="6"
                         x="20"
@@ -8523,7 +8547,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c31 c18 c23"
+                  className="c32 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8531,28 +8555,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c24"
+                    className="c25"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c25"
+                        className="c26"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c26"
+                        className="c27"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c27"
+                        className="c28"
                         height="6"
                         width="6"
                         x="20"
@@ -8565,10 +8589,10 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             </div>
           </div>
           <div
-            className="c32"
+            className="c33"
           >
             <div
-              className="c33 c0"
+              className="c34 c0"
               height="0.0625rem"
             />
           </div>
@@ -8576,19 +8600,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             className="c0"
           >
             <div
-              className="c34"
+              className="c35"
             >
               <label
-                className="c35"
+                className="c36"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c36"
+                className="c37"
               >
                 <input
-                  className="c37"
+                  className="c38"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -8601,7 +8625,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   tag={false}
                 >
                   <svg
-                    className="c38"
+                    className="c39"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -8627,19 +8651,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             className="c0"
           >
             <div
-              className="c34"
+              className="c35"
             >
               <label
-                className="c35"
+                className="c36"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c36"
+                className="c37"
               >
                 <input
-                  className="c37"
+                  className="c38"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -8652,7 +8676,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   tag={false}
                 >
                   <svg
-                    className="c38"
+                    className="c39"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -8678,19 +8702,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             className="c0"
           >
             <div
-              className="c34"
+              className="c35"
             >
               <label
-                className="c35"
+                className="c36"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c36"
+                className="c37"
               >
                 <input
-                  className="c37"
+                  className="c38"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -8703,7 +8727,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   tag={false}
                 >
                   <svg
-                    className="c38"
+                    className="c39"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -8729,19 +8753,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             className="c0"
           >
             <div
-              className="c34"
+              className="c35"
             >
               <label
-                className="c35"
+                className="c36"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c36"
+                className="c37"
               >
                 <input
-                  className="c39"
+                  className="c40"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -8754,7 +8778,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   tag={false}
                 >
                   <svg
-                    className="c38"
+                    className="c39"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -8822,7 +8846,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   margin-left: -0.625rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -8861,7 +8885,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   display: block;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -8871,7 +8895,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   display: block;
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -8881,7 +8905,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   display: block;
 }
 
-.c32 {
+.c33 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -8896,11 +8920,11 @@ exports[`renders <Summary state /> without throwing 1`] = `
   margin-bottom: 1.125rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.375rem;
 }
 
-.c30 {
+.c31 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -8909,18 +8933,18 @@ exports[`renders <Summary state /> without throwing 1`] = `
   padding: 1.5rem;
 }
 
-.c21 {
+.c22 {
   padding-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   background-color: transparent;
   -webkit-text-decoration-skip: objects;
   text-decoration-skip: objects;
   font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
 
-.c23 {
+.c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -8933,52 +8957,52 @@ exports[`renders <Summary state /> without throwing 1`] = `
   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;
 }
 
-.c19 {
+.c20 {
   color: rgb(59,70,204);
   -webkit-text-fill-color: currentcolor;
   color: rgb(255,255,255);
   -webkit-text-fill-color: currentcolor;
 }
 
-.c19:hover {
+.c20:hover {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c36 {
+.c37 {
   cursor: pointer;
 }
 
-.c18 {
+.c19 {
   display: inline-block;
 }
 
-.c18 + button,
-.c18 + a {
+.c19 + button,
+.c19 + a {
   margin-left: 0.375rem;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -9036,7 +9060,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -9044,51 +9068,51 @@ exports[`renders <Summary state /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -9150,7 +9174,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   align-items: center;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -9158,191 +9182,64 @@ exports[`renders <Summary state /> 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);
 }
 
-.c22 svg + span {
+.c23 svg + span {
   margin-left: 0.75rem;
 }
 
-.c22 svg {
-  max-height: 1.125rem;
-}
-
-.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);
-  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;
-  font-weight: 500;
-}
-
-.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);
-}
-
-.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);
-}
-
-.c24 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c24 svg {
+.c23 svg {
   max-height: 1.125rem;
 }
 
@@ -9388,11 +9285,11 @@ exports[`renders <Summary state /> without throwing 1`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
-  padding: 0.625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  min-height: 0rem;
-  height: auto;
+  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;
@@ -9401,6 +9298,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
+  font-weight: 500;
 }
 
 .c25:focus {
@@ -9447,6 +9345,23 @@ exports[`renders <Summary state /> without throwing 1`] = `
   border-color: rgb(216,216,216);
 }
 
+.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);
+}
+
 .c25 svg + span {
   margin-left: 0.75rem;
 }
@@ -9497,6 +9412,11 @@ exports[`renders <Summary state /> without throwing 1`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
+  padding: 0.625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  min-height: 0rem;
+  height: auto;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -9505,7 +9425,6 @@ exports[`renders <Summary state /> without throwing 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
 }
 
 .c26:focus {
@@ -9560,7 +9479,112 @@ exports[`renders <Summary state /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c28 {
+.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);
+  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;
+  font-weight: 500;
+}
+
+.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 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c27 svg {
+  max-height: 1.125rem;
+}
+
+.c29 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -9622,135 +9646,6 @@ exports[`renders <Summary state /> without throwing 1`] = `
   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;
-}
-
-.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;
-  font-weight: 500;
-  float: right;
-}
-
 .c29:focus {
   outline: 0;
   -webkit-text-decoration: none;
@@ -9822,7 +9717,136 @@ exports[`renders <Summary state /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c10 {
+.c30 {
+  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;
+  font-weight: 500;
+  float: right;
+}
+
+.c30:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c30:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c30[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c30:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c30:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c30:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c30:hover {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c30 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c30 svg {
+  max-height: 1.125rem;
+}
+
+.c11 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -9833,7 +9857,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   margin-bottom: 0.1875rem;
 }
 
-.c33 {
+.c34 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -9869,13 +9893,13 @@ exports[`renders <Summary state /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c31 {
+.c32 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.9375rem;
   height: 0.9375rem;
   border-radius: 50%;
@@ -9951,7 +9975,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c35 {
+.c36 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -9975,62 +9999,62 @@ exports[`renders <Summary state /> without throwing 1`] = `
   text-overflow: ellipsis;
 }
 
-.c35:focus {
+.c36:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c35::-webkit-input-placeholder {
+.c36::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35::-moz-placeholder {
+.c36::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:-ms-input-placeholder {
+.c36:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:invalid {
+.c36:invalid {
   box-shadow: none;
 }
 
-.c35:disabled {
+.c36:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled {
+.c36:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c37 {
+.c38 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -10053,62 +10077,62 @@ exports[`renders <Summary state /> without throwing 1`] = `
   min-width: 100%;
 }
 
-.c37:focus {
+.c38:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c37::-webkit-input-placeholder {
+.c38::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37::-moz-placeholder {
+.c38::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:-ms-input-placeholder {
+.c38:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:invalid {
+.c38:invalid {
   box-shadow: none;
 }
 
-.c37:disabled {
+.c38:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c37:disabled::-webkit-input-placeholder {
+.c38:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:disabled::-moz-placeholder {
+.c38:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:disabled:-ms-input-placeholder {
+.c38:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:disabled {
+.c38:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c37:disabled::-webkit-input-placeholder {
+.c38:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c37:disabled::-moz-placeholder {
+.c38:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c37:disabled:-ms-input-placeholder {
+.c38:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c34 {
+.c35 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -10120,20 +10144,26 @@ exports[`renders <Summary state /> without throwing 1`] = `
   align-items: center;
 }
 
-.c34 input {
+.c35 input {
   padding-right: 1.875rem;
 }
 
-.c34 div {
+.c35 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
 
+.c10 {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
 .c9 {
   -webkit-align-items: center;
   -webkit-box-align: center;
@@ -10149,7 +10179,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   justify-content: flex-start;
 }
 
-.c11 {
+.c12 {
   width: 0.0625rem;
   background: rgb(216,216,216);
   height: 1.5rem;
@@ -10173,7 +10203,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -10218,7 +10248,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -10227,7 +10257,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c27 {
+  .c28 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -10236,7 +10266,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c32 {
+  .c33 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -10245,7 +10275,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c32 {
+  .c33 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -10260,7 +10290,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 }
 
 @media (max-width:47.9375rem) {
-  .c11 {
+  .c12 {
     display: none;
   }
 }
@@ -10301,32 +10331,32 @@ exports[`renders <Summary state /> without throwing 1`] = `
               className="c9"
             >
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Custom Image
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Hardware virtual machine
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               />
               <div
-                className="c11"
+                className="c12"
               />
               <div
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c13"
                   color="green"
                   size="0.9375rem"
                 />
@@ -10334,7 +10364,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -10343,12 +10373,12 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Created: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -10356,18 +10386,18 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   </label>
                 </div>
                 <div
-                  className="c11"
+                  className="c12"
                 />
                 <div
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Updated: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -10378,20 +10408,20 @@ exports[`renders <Summary state /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <a
-                className="c17 c18 c19 c20"
+                className="c18 c19 c20 c21"
                 href="http://localhost:3070/~create/undefined"
                 icon={true}
                 rel="noopener noreferrer"
                 target="__blank"
               >
                 <div
-                  className="c21"
+                  className="c22"
                 >
                   <svg
                     className=""
@@ -10418,7 +10448,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -10450,7 +10480,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c23"
+                  className="c25 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -10485,7 +10515,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c25 c18 c23"
+                  className="c26 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10517,7 +10547,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c26 c18 c23"
+                  className="c27 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10552,7 +10582,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c25 c18 c23"
+                  className="c26 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10600,7 +10630,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c26 c18 c23"
+                  className="c27 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10648,14 +10678,14 @@ exports[`renders <Summary state /> without throwing 1`] = `
               </span>
             </div>
             <div
-              className="c27"
+              className="c28"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c28 c18 c23"
+                  className="c29 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10687,7 +10717,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c29 c18 c23"
+                  className="c30 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10720,10 +10750,10 @@ exports[`renders <Summary state /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c30"
+            className="c31"
           >
             <div
-              className="c31 c0"
+              className="c32 c0"
               height="0.0625rem"
             />
           </div>
@@ -10731,19 +10761,19 @@ exports[`renders <Summary state /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -10756,7 +10786,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -10782,19 +10812,19 @@ exports[`renders <Summary state /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -10807,7 +10837,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -10833,19 +10863,19 @@ exports[`renders <Summary state /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -10858,7 +10888,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -10884,19 +10914,19 @@ exports[`renders <Summary state /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c37"
+                  className="c38"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -10909,7 +10939,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -10977,7 +11007,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-left: -0.625rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -11016,7 +11046,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   display: block;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -11026,7 +11056,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   display: block;
 }
 
-.c27 {
+.c28 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -11036,7 +11066,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   display: block;
 }
 
-.c32 {
+.c33 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -11051,11 +11081,11 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-bottom: 1.125rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.375rem;
 }
 
-.c30 {
+.c31 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -11064,18 +11094,18 @@ exports[`renders <Summary state /> without throwing 2`] = `
   padding: 1.5rem;
 }
 
-.c21 {
+.c22 {
   padding-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   background-color: transparent;
   -webkit-text-decoration-skip: objects;
   text-decoration-skip: objects;
   font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
 
-.c23 {
+.c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -11088,52 +11118,52 @@ exports[`renders <Summary state /> without throwing 2`] = `
   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;
 }
 
-.c19 {
+.c20 {
   color: rgb(59,70,204);
   -webkit-text-fill-color: currentcolor;
   color: rgb(255,255,255);
   -webkit-text-fill-color: currentcolor;
 }
 
-.c19:hover {
+.c20:hover {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c36 {
+.c37 {
   cursor: pointer;
 }
 
-.c18 {
+.c19 {
   display: inline-block;
 }
 
-.c18 + button,
-.c18 + a {
+.c19 + button,
+.c19 + a {
   margin-left: 0.375rem;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -11191,7 +11221,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   font-weight: 500;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -11199,178 +11229,47 @@ exports[`renders <Summary state /> without throwing 2`] = `
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
-  max-height: 1.125rem;
-}
-
-.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);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  min-height: 0rem;
-  height: auto;
-  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;
-}
-
-.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(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c25:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.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);
-}
-
-.c25 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c25 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
@@ -11421,6 +11320,11 @@ exports[`renders <Summary state /> without throwing 2`] = `
   color: rgb(216,216,216);
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
+  padding: 0.625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  min-height: 0rem;
+  height: auto;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -11429,7 +11333,6 @@ exports[`renders <Summary state /> without throwing 2`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
 }
 
 .c26:focus {
@@ -11501,7 +11404,134 @@ exports[`renders <Summary state /> without throwing 2`] = `
   max-height: 1.125rem;
 }
 
-.c22 {
+.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);
+  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;
+  font-weight: 500;
+}
+
+.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 {
+  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);
+}
+
+.c27 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c27 svg {
+  max-height: 1.125rem;
+}
+
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -11558,7 +11588,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   align-items: center;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -11566,51 +11596,51 @@ exports[`renders <Summary state /> without throwing 2`] = `
   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 svg + span {
+.c23 svg + span {
   margin-left: 0.75rem;
 }
 
-.c22 svg {
+.c23 svg {
   max-height: 1.125rem;
 }
 
-.c24 {
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -11663,7 +11693,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   font-weight: 500;
 }
 
-.c24:focus {
+.c25:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -11671,180 +11701,47 @@ exports[`renders <Summary state /> without throwing 2`] = `
   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(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c24 svg + span {
+.c25 svg + span {
   margin-left: 0.75rem;
 }
 
-.c24 svg {
-  max-height: 1.125rem;
-}
-
-.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);
-  padding: 0.625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  min-height: 0rem;
-  height: auto;
-  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;
-  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 {
+.c25 svg {
   max-height: 1.125rem;
 }
 
@@ -11894,6 +11791,11 @@ exports[`renders <Summary state /> without throwing 2`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(210,67,58);
+  padding: 0.625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  min-height: 0rem;
+  height: auto;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -11902,7 +11804,6 @@ exports[`renders <Summary state /> without throwing 2`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
   float: right;
 }
 
@@ -11977,7 +11878,136 @@ exports[`renders <Summary state /> without throwing 2`] = `
   max-height: 1.125rem;
 }
 
-.c10 {
+.c30 {
+  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;
+  font-weight: 500;
+  float: right;
+}
+
+.c30:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c30:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c30[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c30:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c30:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c30:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c30:hover {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c30 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c30 svg {
+  max-height: 1.125rem;
+}
+
+.c11 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -11988,7 +12018,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-bottom: 0.1875rem;
 }
 
-.c33 {
+.c34 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -12024,13 +12054,13 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-top: 1.5rem;
 }
 
-.c31 {
+.c32 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.9375rem;
   height: 0.9375rem;
   border-radius: 50%;
@@ -12106,7 +12136,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c35 {
+.c36 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -12130,62 +12160,62 @@ exports[`renders <Summary state /> without throwing 2`] = `
   text-overflow: ellipsis;
 }
 
-.c35:focus {
+.c36:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c35::-webkit-input-placeholder {
+.c36::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35::-moz-placeholder {
+.c36::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:-ms-input-placeholder {
+.c36:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:invalid {
+.c36:invalid {
   box-shadow: none;
 }
 
-.c35:disabled {
+.c36:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled {
+.c36:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c37 {
+.c38 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -12208,62 +12238,62 @@ exports[`renders <Summary state /> without throwing 2`] = `
   min-width: 100%;
 }
 
-.c37:focus {
+.c38:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c37::-webkit-input-placeholder {
+.c38::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37::-moz-placeholder {
+.c38::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:-ms-input-placeholder {
+.c38:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:invalid {
+.c38:invalid {
   box-shadow: none;
 }
 
-.c37:disabled {
+.c38:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c37:disabled::-webkit-input-placeholder {
+.c38:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:disabled::-moz-placeholder {
+.c38:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:disabled:-ms-input-placeholder {
+.c38:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c37:disabled {
+.c38:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c37:disabled::-webkit-input-placeholder {
+.c38:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c37:disabled::-moz-placeholder {
+.c38:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c37:disabled:-ms-input-placeholder {
+.c38:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c34 {
+.c35 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -12275,20 +12305,26 @@ exports[`renders <Summary state /> without throwing 2`] = `
   align-items: center;
 }
 
-.c34 input {
+.c35 input {
   padding-right: 1.875rem;
 }
 
-.c34 div {
+.c35 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
 
+.c10 {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
 .c9 {
   -webkit-align-items: center;
   -webkit-box-align: center;
@@ -12304,7 +12340,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   justify-content: flex-start;
 }
 
-.c11 {
+.c12 {
   width: 0.0625rem;
   background: rgb(216,216,216);
   height: 1.5rem;
@@ -12328,7 +12364,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -12373,7 +12409,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -12382,7 +12418,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c27 {
+  .c28 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -12391,7 +12427,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c32 {
+  .c33 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -12400,7 +12436,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c32 {
+  .c33 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -12415,7 +12451,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media (max-width:47.9375rem) {
-  .c11 {
+  .c12 {
     display: none;
   }
 }
@@ -12456,32 +12492,32 @@ exports[`renders <Summary state /> without throwing 2`] = `
               className="c9"
             >
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Custom Image
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Hardware virtual machine
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               />
               <div
-                className="c11"
+                className="c12"
               />
               <div
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c13"
                   color="grey"
                   size="0.9375rem"
                 />
@@ -12489,7 +12525,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -12498,12 +12534,12 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Created: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -12511,18 +12547,18 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   </label>
                 </div>
                 <div
-                  className="c11"
+                  className="c12"
                 />
                 <div
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Updated: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -12533,20 +12569,20 @@ exports[`renders <Summary state /> without throwing 2`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <a
-                className="c17 c18 c19 c20"
+                className="c18 c19 c20 c21"
                 href="http://localhost:3070/~create/undefined"
                 icon={true}
                 rel="noopener noreferrer"
                 target="__blank"
               >
                 <div
-                  className="c21"
+                  className="c22"
                 >
                   <svg
                     className=""
@@ -12573,7 +12609,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -12605,7 +12641,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c23"
+                  className="c25 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -12640,7 +12676,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c25 c18 c23"
+                  className="c26 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -12672,7 +12708,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c26 c18 c23"
+                  className="c27 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -12707,7 +12743,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c25 c18 c23"
+                  className="c26 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -12755,7 +12791,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c26 c18 c23"
+                  className="c27 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -12803,14 +12839,14 @@ exports[`renders <Summary state /> without throwing 2`] = `
               </span>
             </div>
             <div
-              className="c27"
+              className="c28"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c28 c18 c23"
+                  className="c29 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -12842,7 +12878,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c29 c18 c23"
+                  className="c30 c19 c24"
                   disabled={false}
                   href=""
                   icon={true}
@@ -12875,10 +12911,10 @@ exports[`renders <Summary state /> without throwing 2`] = `
             </div>
           </div>
           <div
-            className="c30"
+            className="c31"
           >
             <div
-              className="c31 c0"
+              className="c32 c0"
               height="0.0625rem"
             />
           </div>
@@ -12886,19 +12922,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -12911,7 +12947,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -12937,19 +12973,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -12962,7 +12998,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -12988,19 +13024,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -13013,7 +13049,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -13039,19 +13075,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c32"
+              className="c33"
             >
               <label
-                className="c33"
+                className="c34"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c34"
+                className="c35"
               >
                 <input
-                  className="c37"
+                  className="c38"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -13064,7 +13100,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c36"
+                    className="c37"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -13132,7 +13168,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-left: -0.625rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -13171,7 +13207,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   display: block;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -13181,7 +13217,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   display: block;
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -13191,7 +13227,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   display: block;
 }
 
-.c30 {
+.c31 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -13206,11 +13242,11 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-bottom: 1.125rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.375rem;
 }
 
-.c28 {
+.c29 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -13219,18 +13255,18 @@ exports[`renders <Summary state /> without throwing 3`] = `
   padding: 1.5rem;
 }
 
-.c21 {
+.c22 {
   padding-top: 0.1875rem;
 }
 
-.c20 {
+.c21 {
   background-color: transparent;
   -webkit-text-decoration-skip: objects;
   text-decoration-skip: objects;
   font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
 
-.c23 {
+.c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -13243,52 +13279,52 @@ exports[`renders <Summary state /> without throwing 3`] = `
   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;
 }
 
-.c19 {
+.c20 {
   color: rgb(59,70,204);
   -webkit-text-fill-color: currentcolor;
   color: rgb(255,255,255);
   -webkit-text-fill-color: currentcolor;
 }
 
-.c19:hover {
+.c20:hover {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c34 {
+.c35 {
   cursor: pointer;
 }
 
-.c18 {
+.c19 {
   display: inline-block;
 }
 
-.c18 + button,
-.c18 + a {
+.c19 + button,
+.c19 + a {
   margin-left: 0.375rem;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -13346,7 +13382,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   font-weight: 500;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -13354,51 +13390,51 @@ exports[`renders <Summary state /> without throwing 3`] = `
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -13460,7 +13496,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   align-items: center;
 }
 
-.c22:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -13468,68 +13504,68 @@ exports[`renders <Summary state /> without throwing 3`] = `
   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);
 }
 
-.c22 svg + span {
+.c23 svg + span {
   margin-left: 0.75rem;
 }
 
-.c22 svg {
+.c23 svg {
   max-height: 1.125rem;
 }
 
-.c24 {
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -13587,7 +13623,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   font-weight: 500;
 }
 
-.c24:focus {
+.c25:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -13595,219 +13631,64 @@ exports[`renders <Summary state /> without throwing 3`] = `
   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(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.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);
 }
 
-.c24 svg + span {
+.c25 svg + span {
   margin-left: 0.75rem;
 }
 
-.c24 svg {
-  max-height: 1.125rem;
-}
-
-.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);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  min-height: 0rem;
-  height: auto;
-  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;
-  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: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);
-}
-
-.c26 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c26 svg {
+.c25 svg {
   max-height: 1.125rem;
 }
 
@@ -13862,6 +13743,11 @@ exports[`renders <Summary state /> without throwing 3`] = `
   color: rgb(216,216,216);
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
+  padding: 0.625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  min-height: 0rem;
+  height: auto;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -13870,7 +13756,6 @@ exports[`renders <Summary state /> without throwing 3`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
   float: right;
 }
 
@@ -13962,7 +13847,158 @@ exports[`renders <Summary state /> without throwing 3`] = `
   max-height: 1.125rem;
 }
 
-.c10 {
+.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);
+  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;
+  font-weight: 500;
+  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:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c28:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c28 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c28 svg {
+  max-height: 1.125rem;
+}
+
+.c11 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -13973,7 +14009,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-bottom: 0.1875rem;
 }
 
-.c31 {
+.c32 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -14009,13 +14045,13 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-top: 1.5rem;
 }
 
-.c29 {
+.c30 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.9375rem;
   height: 0.9375rem;
   border-radius: 50%;
@@ -14091,7 +14127,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c33 {
+.c34 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -14115,62 +14151,62 @@ exports[`renders <Summary state /> without throwing 3`] = `
   text-overflow: ellipsis;
 }
 
-.c33:focus {
+.c34:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c33::-webkit-input-placeholder {
+.c34::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33::-moz-placeholder {
+.c34::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:-ms-input-placeholder {
+.c34:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:invalid {
+.c34:invalid {
   box-shadow: none;
 }
 
-.c33:disabled {
+.c34:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c33:disabled::-webkit-input-placeholder {
+.c34:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled::-moz-placeholder {
+.c34:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled:-ms-input-placeholder {
+.c34:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled {
+.c34:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled::-webkit-input-placeholder {
+.c34:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled::-moz-placeholder {
+.c34:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled:-ms-input-placeholder {
+.c34:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35 {
+.c36 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -14193,62 +14229,62 @@ exports[`renders <Summary state /> without throwing 3`] = `
   min-width: 100%;
 }
 
-.c35:focus {
+.c36:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c35::-webkit-input-placeholder {
+.c36::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35::-moz-placeholder {
+.c36::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:-ms-input-placeholder {
+.c36:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:invalid {
+.c36:invalid {
   box-shadow: none;
 }
 
-.c35:disabled {
+.c36:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled {
+.c36:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32 {
+.c33 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -14260,20 +14296,26 @@ exports[`renders <Summary state /> without throwing 3`] = `
   align-items: center;
 }
 
-.c32 input {
+.c33 input {
   padding-right: 1.875rem;
 }
 
-.c32 div {
+.c33 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
 
+.c10 {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
 .c9 {
   -webkit-align-items: center;
   -webkit-box-align: center;
@@ -14289,7 +14331,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   justify-content: flex-start;
 }
 
-.c11 {
+.c12 {
   width: 0.0625rem;
   background: rgb(216,216,216);
   height: 1.5rem;
@@ -14313,7 +14355,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -14358,7 +14400,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -14367,7 +14409,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c25 {
+  .c26 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -14376,7 +14418,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c30 {
+  .c31 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -14385,7 +14427,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c30 {
+  .c31 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -14400,7 +14442,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media (max-width:47.9375rem) {
-  .c11 {
+  .c12 {
     display: none;
   }
 }
@@ -14441,32 +14483,32 @@ exports[`renders <Summary state /> without throwing 3`] = `
               className="c9"
             >
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Custom Image
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               >
                 Hardware virtual machine
               </label>
               <div
-                className="c11"
+                className="c12"
               />
               <label
-                className="c10"
+                className="c10 c11"
               />
               <div
-                className="c11"
+                className="c12"
               />
               <div
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c13"
                   color="primary"
                   size="0.9375rem"
                 />
@@ -14474,7 +14516,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -14483,12 +14525,12 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Created: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -14496,18 +14538,18 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   </label>
                 </div>
                 <div
-                  className="c11"
+                  className="c12"
                 />
                 <div
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c11"
                   >
                     Updated: 
                   </label>
                   <label
-                    className="c10"
+                    className="c11"
                   >
                      
                     almost NaN years
@@ -14518,20 +14560,20 @@ exports[`renders <Summary state /> without throwing 3`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <a
-                className="c17 c18 c19 c20"
+                className="c18 c19 c20 c21"
                 href="http://localhost:3070/~create/undefined"
                 icon={true}
                 rel="noopener noreferrer"
                 target="__blank"
               >
                 <div
-                  className="c21"
+                  className="c22"
                 >
                   <svg
                     className=""
@@ -14558,7 +14600,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14590,7 +14632,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c23"
+                  className="c25 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14625,7 +14667,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14657,7 +14699,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c23"
+                  className="c25 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14692,7 +14734,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c23"
+                  className="c23 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14740,7 +14782,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c23"
+                  className="c25 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14788,14 +14830,14 @@ exports[`renders <Summary state /> without throwing 3`] = `
               </span>
             </div>
             <div
-              className="c25"
+              className="c26"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c26 c18 c23"
+                  className="c27 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14827,7 +14869,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c27 c18 c23"
+                  className="c28 c19 c24"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14860,10 +14902,10 @@ exports[`renders <Summary state /> without throwing 3`] = `
             </div>
           </div>
           <div
-            className="c28"
+            className="c29"
           >
             <div
-              className="c29 c0"
+              className="c30 c0"
               height="0.0625rem"
             />
           </div>
@@ -14871,19 +14913,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c33"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -14896,7 +14938,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c34"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -14922,19 +14964,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c33"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -14947,7 +14989,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c34"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -14973,19 +15015,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c33"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -14998,7 +15040,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c34"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -15024,19 +15066,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -15049,7 +15091,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c34"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
diff --git a/packages/my-joy-instances/src/components/instances/summary.js b/packages/my-joy-instances/src/components/instances/summary.js
index b6776660..b461e26b 100644
--- a/packages/my-joy-instances/src/components/instances/summary.js
+++ b/packages/my-joy-instances/src/components/instances/summary.js
@@ -40,6 +40,12 @@ const GreyLabel = styled(Label)`
   padding-right: ${remcalc(3)};
 `;
 
+const TrimedLabel = styled(Label)`
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+`
+
 const Flex = styled.div`
   align-items: center;
   display: flex;
@@ -78,17 +84,17 @@ export const Meta = ({
   </Row>,
   <Margin top={2} bottom={3}>
     <Flex>
-      <Label>
+      <TrimedLabel>
         {image && image.name ? titleCase(image.name) : 'Custom Image'}
-      </Label>
+      </TrimedLabel>
       <VerticalDivider />
-      <Label>
+      <TrimedLabel>
         {brand === 'LX'
           ? 'Infrastructure container'
           : 'Hardware virtual machine'}
-      </Label>
+      </TrimedLabel>
       <VerticalDivider />
-      <Label>{(instance.package || {}).name}</Label>
+      <TrimedLabel>{(instance.package || {}).name}</TrimedLabel>
       <VerticalDivider />
       <Flex>
         <DotIcon
diff --git a/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png b/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png
index b9b097b9..ae2252eb 100644
Binary files a/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png and b/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png differ
diff --git a/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png b/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png
index b9b097b9..99b81411 100644
Binary files a/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png and b/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png differ
diff --git a/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-error-1-snap.png b/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-error-1-snap.png
index b9b097b9..99b81411 100644
Binary files a/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-error-1-snap.png and b/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-error-1-snap.png differ
diff --git a/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png b/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png
index 3c7e5262..59880dc7 100644
Binary files a/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png and b/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png differ
diff --git a/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png b/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png
index a141971c..99b81411 100644
Binary files a/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png and b/packages/my-joy-instances/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png differ
diff --git a/packages/my-joy-instances/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap b/packages/my-joy-instances/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap
index 8637fef2..1081dc8b 100644
--- a/packages/my-joy-instances/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap
+++ b/packages/my-joy-instances/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap
@@ -900,11 +900,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 1.125rem;
 }
 
-.c14 {
+.c15 {
   margin-top: 0.375rem;
 }
 
-.c31 {
+.c32 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -913,18 +913,18 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding: 1.5rem;
 }
 
-.c22 {
+.c23 {
   padding-top: 0.1875rem;
 }
 
-.c21 {
+.c22 {
   background-color: transparent;
   -webkit-text-decoration-skip: objects;
   text-decoration-skip: objects;
   font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
 
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -937,52 +937,52 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   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;
 }
 
-.c20 {
+.c21 {
   color: rgb(59,70,204);
   -webkit-text-fill-color: currentcolor;
   color: rgb(255,255,255);
   -webkit-text-fill-color: currentcolor;
 }
 
-.c20:hover {
+.c21:hover {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c37 {
+.c38 {
   cursor: pointer;
 }
 
-.c19 {
+.c20 {
   display: inline-block;
 }
 
-.c19 + button,
-.c19 + a {
+.c20 + button,
+.c20 + a {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c19 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1040,7 +1040,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   font-weight: 500;
 }
 
-.c18:focus {
+.c19:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1048,51 +1048,51 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(45,56,132);
 }
 
-.c18:hover {
+.c19:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c19:active,
+.c19:active:hover,
+.c19:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c18[disabled] {
+.c19[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c18:focus {
+.c19:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c18:hover {
+.c19:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c19:active,
+.c19:active:hover,
+.c19:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c18 svg + span {
+.c19 svg + span {
   margin-left: 0.75rem;
 }
 
-.c18 svg {
+.c19 svg {
   max-height: 1.125rem;
 }
 
-.c23 {
+.c24 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1154,7 +1154,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c23:focus {
+.c24:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1162,191 +1162,64 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   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);
 }
 
-.c23:focus {
+.c24:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c24:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c23 svg + span {
+.c24 svg + span {
   margin-left: 0.75rem;
 }
 
-.c23 svg {
-  max-height: 1.125rem;
-}
-
-.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);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  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;
-  font-weight: 500;
-}
-
-.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(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c25:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.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);
-}
-
-.c25 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c25 svg {
+.c24 svg {
   max-height: 1.125rem;
 }
 
@@ -1392,11 +1265,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
-  padding: 0.625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  min-height: 0rem;
-  height: auto;
+  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;
@@ -1405,6 +1278,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
+  font-weight: 500;
 }
 
 .c26:focus {
@@ -1451,6 +1325,23 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(216,216,216);
 }
 
+.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);
+}
+
 .c26 svg + span {
   margin-left: 0.75rem;
 }
@@ -1501,6 +1392,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
+  padding: 0.625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  min-height: 0rem;
+  height: auto;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -1509,7 +1405,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
 }
 
 .c27:focus {
@@ -1564,7 +1459,112 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
-.c29 {
+.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);
+  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;
+  font-weight: 500;
+}
+
+.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 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c28 svg {
+  max-height: 1.125rem;
+}
+
+.c30 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1626,135 +1626,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   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;
-}
-
-.c30 {
-  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;
-  font-weight: 500;
-  float: right;
-}
-
 .c30:focus {
   outline: 0;
   -webkit-text-decoration: none;
@@ -1826,7 +1697,136 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
-.c11 {
+.c31 {
+  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;
+  font-weight: 500;
+  float: right;
+}
+
+.c31:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c31:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c31:active,
+.c31:active:hover,
+.c31:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c31[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c31:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c31:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c31:active,
+.c31:active:hover,
+.c31:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c31:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c31: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 {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c31 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c31 svg {
+  max-height: 1.125rem;
+}
+
+.c12 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -1837,7 +1837,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0.1875rem;
 }
 
-.c34 {
+.c35 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -1899,7 +1899,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-left: -0.625rem;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1938,7 +1938,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1948,7 +1948,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1958,7 +1958,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c33 {
+.c34 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1989,13 +1989,13 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-top: 1.5rem;
 }
 
-.c32 {
+.c33 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c13 {
+.c14 {
   width: 0.9375rem;
   height: 0.9375rem;
   border-radius: 50%;
@@ -2071,7 +2071,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0.4375rem;
 }
 
-.c36 {
+.c37 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -2094,62 +2094,62 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   min-width: 100%;
 }
 
-.c36:focus {
+.c37:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c36::-webkit-input-placeholder {
+.c37::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36::-moz-placeholder {
+.c37::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36:-ms-input-placeholder {
+.c37:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36:invalid {
+.c37:invalid {
   box-shadow: none;
 }
 
-.c36:disabled {
+.c37:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c36:disabled::-webkit-input-placeholder {
+.c37:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36:disabled::-moz-placeholder {
+.c37:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36:disabled:-ms-input-placeholder {
+.c37:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36:disabled {
+.c37:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c36:disabled::-webkit-input-placeholder {
+.c37:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c36:disabled::-moz-placeholder {
+.c37:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c36:disabled:-ms-input-placeholder {
+.c37:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35 {
+.c36 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2161,16 +2161,16 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c35 input {
+.c36 input {
   padding-right: 1.875rem;
 }
 
-.c35 div {
+.c36 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c38 {
+.c39 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2183,20 +2183,26 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0rem;
 }
 
-.c38 input {
+.c39 input {
   padding-right: 1.875rem;
 }
 
-.c38 div {
+.c39 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c15 {
+.c16 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
 
+.c11 {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
 .c10 {
   -webkit-align-items: center;
   -webkit-box-align: center;
@@ -2212,7 +2218,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   justify-content: flex-start;
 }
 
-.c12 {
+.c13 {
   width: 0.0625rem;
   background: rgb(216,216,216);
   height: 1.5rem;
@@ -2261,7 +2267,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -2306,7 +2312,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c17 {
+  .c18 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -2315,7 +2321,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c28 {
+  .c29 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -2324,7 +2330,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c33 {
+  .c34 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -2333,7 +2339,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:64em) {
-  .c33 {
+  .c34 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -2348,7 +2354,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media (max-width:47.9375rem) {
-  .c12 {
+  .c13 {
     display: none;
   }
 }
@@ -2392,34 +2398,34 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 className="c10"
               >
                 <label
-                  className="c11"
+                  className="c11 c12"
                 >
                   Alpine 3
                 </label>
                 <div
-                  className="c12"
+                  className="c13"
                 />
                 <label
-                  className="c11"
+                  className="c11 c12"
                 >
                   Hardware virtual machine
                 </label>
                 <div
-                  className="c12"
+                  className="c13"
                 />
                 <label
-                  className="c11"
+                  className="c11 c12"
                 >
                   g4-highcpu-128M
                 </label>
                 <div
-                  className="c12"
+                  className="c13"
                 />
                 <div
                   className="c10"
                 >
                   <span
-                    className="c13"
+                    className="c14"
                     color="green"
                     size="0.9375rem"
                   />
@@ -2427,7 +2433,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 </div>
               </div>
               <div
-                className="c14"
+                className="c15"
               >
                 <div
                   className="c10"
@@ -2436,12 +2442,12 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     className="c10"
                   >
                     <label
-                      className="c15 c11"
+                      className="c16 c12"
                     >
                       Created: 
                     </label>
                     <label
-                      className="c11"
+                      className="c12"
                     >
                        
                       almost NaN years
@@ -2449,18 +2455,18 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     </label>
                   </div>
                   <div
-                    className="c12"
+                    className="c13"
                   />
                   <div
                     className="c10"
                   >
                     <label
-                      className="c15 c11"
+                      className="c16 c12"
                     >
                       Updated: 
                     </label>
                     <label
-                      className="c11"
+                      className="c12"
                     >
                        
                       almost NaN years
@@ -2471,20 +2477,20 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c16"
+              className="c17"
             >
               <div
-                className="c17"
+                className="c18"
               >
                 <a
-                  className="c18 c19 c20 c21"
+                  className="c19 c20 c21 c22"
                   href="http://localhost:3070/~create/undefined"
                   icon={true}
                   rel="noopener noreferrer"
                   target="__blank"
                 >
                   <div
-                    className="c22"
+                    className="c23"
                   >
                     <svg
                       className=""
@@ -2511,7 +2517,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c23 c19 c24"
+                    className="c24 c20 c25"
                     disabled={true}
                     href=""
                     icon={true}
@@ -2543,7 +2549,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c25 c19 c24"
+                    className="c26 c20 c25"
                     disabled={true}
                     href=""
                     icon={true}
@@ -2578,7 +2584,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c26 c19 c24"
+                    className="c27 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2610,7 +2616,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c27 c19 c24"
+                    className="c28 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2645,7 +2651,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c26 c19 c24"
+                    className="c27 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2693,7 +2699,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c27 c19 c24"
+                    className="c28 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2741,14 +2747,14 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 </span>
               </div>
               <div
-                className="c28"
+                className="c29"
               >
                 <span
                   name="react-responsive-mock"
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c29 c19 c24"
+                    className="c30 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2780,7 +2786,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c30 c19 c24"
+                    className="c31 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2813,10 +2819,10 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c31"
+              className="c32"
             >
               <div
-                className="c32 c1"
+                className="c33 c1"
                 height="0.0625rem"
               />
             </div>
@@ -2824,19 +2830,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Short ID
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -2849,7 +2855,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -2875,19 +2881,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   ID
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -2900,7 +2906,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -2926,19 +2932,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   CN UUID
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -2951,7 +2957,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -2977,19 +2983,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Image UUID
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -3002,7 +3008,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -3028,19 +3034,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Login
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -3053,7 +3059,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -3079,19 +3085,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Public IP address 1
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -3104,7 +3110,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -3130,19 +3136,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Public IP address 2
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -3155,7 +3161,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -3181,19 +3187,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Private IP address 1
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -3206,7 +3212,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -3232,19 +3238,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Private IP address 2
                 </label>
                 <div
-                  className="c38"
+                  className="c39"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -3257,7 +3263,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -3293,11 +3299,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 1.125rem;
 }
 
-.c14 {
+.c15 {
   margin-top: 0.375rem;
 }
 
-.c31 {
+.c32 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -3306,18 +3312,18 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding: 1.5rem;
 }
 
-.c22 {
+.c23 {
   padding-top: 0.1875rem;
 }
 
-.c21 {
+.c22 {
   background-color: transparent;
   -webkit-text-decoration-skip: objects;
   text-decoration-skip: objects;
   font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
 
-.c24 {
+.c25 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -3330,52 +3336,52 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   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;
 }
 
-.c20 {
+.c21 {
   color: rgb(59,70,204);
   -webkit-text-fill-color: currentcolor;
   color: rgb(255,255,255);
   -webkit-text-fill-color: currentcolor;
 }
 
-.c20:hover {
+.c21:hover {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c37 {
+.c38 {
   cursor: pointer;
 }
 
-.c19 {
+.c20 {
   display: inline-block;
 }
 
-.c19 + button,
-.c19 + a {
+.c20 + button,
+.c20 + a {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c19 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3433,7 +3439,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   font-weight: 500;
 }
 
-.c18:focus {
+.c19:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3441,51 +3447,51 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(45,56,132);
 }
 
-.c18:hover {
+.c19:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c19:active,
+.c19:active:hover,
+.c19:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c18[disabled] {
+.c19[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c18:focus {
+.c19:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c18:hover {
+.c19:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c19:active,
+.c19:active:hover,
+.c19:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c18 svg + span {
+.c19 svg + span {
   margin-left: 0.75rem;
 }
 
-.c18 svg {
+.c19 svg {
   max-height: 1.125rem;
 }
 
-.c23 {
+.c24 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3547,7 +3553,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c23:focus {
+.c24:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3555,191 +3561,64 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   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);
 }
 
-.c23:focus {
+.c24:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c24:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c23 svg + span {
+.c24 svg + span {
   margin-left: 0.75rem;
 }
 
-.c23 svg {
-  max-height: 1.125rem;
-}
-
-.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);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  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;
-  font-weight: 500;
-}
-
-.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(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c25:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.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);
-}
-
-.c25 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c25 svg {
+.c24 svg {
   max-height: 1.125rem;
 }
 
@@ -3785,11 +3664,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
-  padding: 0.625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  min-height: 0rem;
-  height: auto;
+  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;
@@ -3798,6 +3677,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
+  font-weight: 500;
 }
 
 .c26:focus {
@@ -3844,6 +3724,23 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(216,216,216);
 }
 
+.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);
+}
+
 .c26 svg + span {
   margin-left: 0.75rem;
 }
@@ -3894,6 +3791,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
+  padding: 0.625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  min-height: 0rem;
+  height: auto;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -3902,7 +3804,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
 }
 
 .c27:focus {
@@ -3957,7 +3858,112 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
-.c29 {
+.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);
+  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;
+  font-weight: 500;
+}
+
+.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 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c28 svg {
+  max-height: 1.125rem;
+}
+
+.c30 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4019,135 +4025,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   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;
-}
-
-.c30 {
-  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;
-  font-weight: 500;
-  float: right;
-}
-
 .c30:focus {
   outline: 0;
   -webkit-text-decoration: none;
@@ -4219,7 +4096,136 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
-.c11 {
+.c31 {
+  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;
+  font-weight: 500;
+  float: right;
+}
+
+.c31:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c31:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c31:active,
+.c31:active:hover,
+.c31:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c31[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c31:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c31:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c31:active,
+.c31:active:hover,
+.c31:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c31:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c31: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 {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c31 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c31 svg {
+  max-height: 1.125rem;
+}
+
+.c12 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -4230,7 +4236,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0.1875rem;
 }
 
-.c34 {
+.c35 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -4292,7 +4298,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-left: -0.625rem;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -4331,7 +4337,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4341,7 +4347,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4351,7 +4357,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c33 {
+.c34 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4382,13 +4388,13 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-top: 1.5rem;
 }
 
-.c32 {
+.c33 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c13 {
+.c14 {
   width: 0.9375rem;
   height: 0.9375rem;
   border-radius: 50%;
@@ -4464,7 +4470,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0.4375rem;
 }
 
-.c36 {
+.c37 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -4487,62 +4493,62 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   min-width: 100%;
 }
 
-.c36:focus {
+.c37:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c36::-webkit-input-placeholder {
+.c37::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36::-moz-placeholder {
+.c37::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36:-ms-input-placeholder {
+.c37:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36:invalid {
+.c37:invalid {
   box-shadow: none;
 }
 
-.c36:disabled {
+.c37:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c36:disabled::-webkit-input-placeholder {
+.c37:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36:disabled::-moz-placeholder {
+.c37:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36:disabled:-ms-input-placeholder {
+.c37:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c36:disabled {
+.c37:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c36:disabled::-webkit-input-placeholder {
+.c37:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c36:disabled::-moz-placeholder {
+.c37:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c36:disabled:-ms-input-placeholder {
+.c37:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c35 {
+.c36 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -4554,16 +4560,16 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c35 input {
+.c36 input {
   padding-right: 1.875rem;
 }
 
-.c35 div {
+.c36 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c38 {
+.c39 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -4576,20 +4582,26 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0rem;
 }
 
-.c38 input {
+.c39 input {
   padding-right: 1.875rem;
 }
 
-.c38 div {
+.c39 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c15 {
+.c16 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
 
+.c11 {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
 .c10 {
   -webkit-align-items: center;
   -webkit-box-align: center;
@@ -4605,7 +4617,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   justify-content: flex-start;
 }
 
-.c12 {
+.c13 {
   width: 0.0625rem;
   background: rgb(216,216,216);
   height: 1.5rem;
@@ -4654,7 +4666,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -4699,7 +4711,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c17 {
+  .c18 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -4708,7 +4720,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c28 {
+  .c29 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -4717,7 +4729,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c33 {
+  .c34 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -4726,7 +4738,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:64em) {
-  .c33 {
+  .c34 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -4741,7 +4753,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media (max-width:47.9375rem) {
-  .c12 {
+  .c13 {
     display: none;
   }
 }
@@ -4785,34 +4797,34 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 className="c10"
               >
                 <label
-                  className="c11"
+                  className="c11 c12"
                 >
                   Custom Image
                 </label>
                 <div
-                  className="c12"
+                  className="c13"
                 />
                 <label
-                  className="c11"
+                  className="c11 c12"
                 >
                   Infrastructure container
                 </label>
                 <div
-                  className="c12"
+                  className="c13"
                 />
                 <label
-                  className="c11"
+                  className="c11 c12"
                 >
                   g4-highcpu-128M
                 </label>
                 <div
-                  className="c12"
+                  className="c13"
                 />
                 <div
                   className="c10"
                 >
                   <span
-                    className="c13"
+                    className="c14"
                     color="green"
                     size="0.9375rem"
                   />
@@ -4820,7 +4832,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 </div>
               </div>
               <div
-                className="c14"
+                className="c15"
               >
                 <div
                   className="c10"
@@ -4829,12 +4841,12 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     className="c10"
                   >
                     <label
-                      className="c15 c11"
+                      className="c16 c12"
                     >
                       Created: 
                     </label>
                     <label
-                      className="c11"
+                      className="c12"
                     >
                        
                       almost NaN years
@@ -4842,18 +4854,18 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     </label>
                   </div>
                   <div
-                    className="c12"
+                    className="c13"
                   />
                   <div
                     className="c10"
                   >
                     <label
-                      className="c15 c11"
+                      className="c16 c12"
                     >
                       Updated: 
                     </label>
                     <label
-                      className="c11"
+                      className="c12"
                     >
                        
                       almost NaN years
@@ -4864,20 +4876,20 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c16"
+              className="c17"
             >
               <div
-                className="c17"
+                className="c18"
               >
                 <a
-                  className="c18 c19 c20 c21"
+                  className="c19 c20 c21 c22"
                   href="http://localhost:3070/~create/undefined"
                   icon={true}
                   rel="noopener noreferrer"
                   target="__blank"
                 >
                   <div
-                    className="c22"
+                    className="c23"
                   >
                     <svg
                       className=""
@@ -4904,7 +4916,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c23 c19 c24"
+                    className="c24 c20 c25"
                     disabled={true}
                     href=""
                     icon={true}
@@ -4936,7 +4948,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c25 c19 c24"
+                    className="c26 c20 c25"
                     disabled={true}
                     href=""
                     icon={true}
@@ -4971,7 +4983,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c26 c19 c24"
+                    className="c27 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -5003,7 +5015,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c27 c19 c24"
+                    className="c28 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -5038,7 +5050,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c26 c19 c24"
+                    className="c27 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -5086,7 +5098,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c27 c19 c24"
+                    className="c28 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -5134,14 +5146,14 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 </span>
               </div>
               <div
-                className="c28"
+                className="c29"
               >
                 <span
                   name="react-responsive-mock"
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c29 c19 c24"
+                    className="c30 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -5173,7 +5185,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c30 c19 c24"
+                    className="c31 c20 c25"
                     disabled={false}
                     href=""
                     icon={true}
@@ -5206,10 +5218,10 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c31"
+              className="c32"
             >
               <div
-                className="c32 c1"
+                className="c33 c1"
                 height="0.0625rem"
               />
             </div>
@@ -5217,19 +5229,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Short ID
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5242,7 +5254,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -5268,19 +5280,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   ID
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5293,7 +5305,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -5319,19 +5331,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   CN UUID
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5344,7 +5356,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -5370,19 +5382,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Image UUID
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5395,7 +5407,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -5421,19 +5433,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Login
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5446,7 +5458,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -5472,19 +5484,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Public IP address 1
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5497,7 +5509,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -5523,19 +5535,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Public IP address 2
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5548,7 +5560,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -5574,19 +5586,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Private IP address 1
                 </label>
                 <div
-                  className="c35"
+                  className="c36"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5599,7 +5611,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -5625,19 +5637,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c33"
+                className="c34"
               >
                 <label
-                  className="c34"
+                  className="c35"
                   htmlFor=""
                 >
                   Private IP address 2
                 </label>
                 <div
-                  className="c38"
+                  className="c39"
                 >
                   <input
-                    className="c36"
+                    className="c37"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5650,7 +5662,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c37"
+                      className="c38"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
diff --git a/packages/my-joy-instances/src/containers/navigation/__tests__/__snapshots__/breadcrumb.spec.js.snap b/packages/my-joy-instances/src/containers/navigation/__tests__/__snapshots__/breadcrumb.spec.js.snap
index 592a7be8..9a8b77ae 100644
--- a/packages/my-joy-instances/src/containers/navigation/__tests__/__snapshots__/breadcrumb.spec.js.snap
+++ b/packages/my-joy-instances/src/containers/navigation/__tests__/__snapshots__/breadcrumb.spec.js.snap
@@ -73,8 +73,8 @@ exports[`renders <Breadcrumb /> without throwing 1`] = `
 }
 
 .c2 {
-  padding-top: 0.75rem;
-  padding-bottom: 0.75rem;
+  padding-top: 0.375rem;
+  padding-bottom: 0.375rem;
 }
 
 .c8 {
@@ -264,8 +264,8 @@ exports[`renders <Breadcrumb match /> without throwing 1`] = `
 }
 
 .c2 {
-  padding-top: 0.75rem;
-  padding-bottom: 0.75rem;
+  padding-top: 0.375rem;
+  padding-bottom: 0.375rem;
 }
 
 .c8 {