@northdata/fomantic-ui 2.8.722 → 2.9.401

package/lib/semantic-ui/dist/components/label.css

@@ -1,10 +1,10 @@
 /*!
- * # Fomantic-UI - Label
- * http://github.com/fomantic/Fomantic-UI/
+ * # Fomantic-UI 2.9.4 - Label
+ * https://github.com/fomantic/Fomantic-UI/
  *
  *
  * Released under the MIT license
- * http://opensource.org/licenses/MIT
+ * https://opensource.org/licenses/MIT
  *
  */
 
@@ -18,7 +18,7 @@
   line-height: 1;
   vertical-align: baseline;
   margin: 0 0.14285714em;
-  background-color: #E8E8E8;
+  background-color: #e8e8e8;
   background-image: none;
   padding: 0.5833em 0.833em;
   color: rgba(0, 0, 0, 0.6);
@@ -26,7 +26,6 @@
   font-weight: bold;
   border: 0 solid transparent;
   border-radius: 0;
-  -webkit-transition: background 0.1s ease;
   transition: background 0.1s ease;
 }
 .ui.label:first-child {
@@ -46,7 +45,6 @@ a.ui.label {
   cursor: pointer;
   color: inherit;
   opacity: 0.5;
-  -webkit-transition: 0.1s opacity ease;
   transition: 0.1s opacity ease;
 }
 .ui.label > a:hover {
@@ -61,7 +59,7 @@ a.ui.label {
 }
 
 /* Icon */
-.ui.left.icon.label > .icon,
+.ui.ui[class*="left icon"].label > .icon,
 .ui.label > .icon {
   width: auto;
   margin: 0 0.75em 0 0;
@@ -85,7 +83,6 @@ a.ui.label {
   cursor: pointer;
   font-size: 0.92857143em;
   opacity: 0.5;
-  -webkit-transition: background 0.1s ease;
   transition: background 0.1s ease;
 }
 .ui.label > .close.icon:hover,
@@ -94,10 +91,14 @@ a.ui.label {
 }
 
 /* Backward compatible positioning */
-.ui.label.left.icon > .close.icon,
-.ui.label.left.icon > .delete.icon {
+.ui.label[class*="left icon"] > .close.icon,
+.ui.label[class*="left icon"] > .delete.icon {
   margin: 0 0.5em 0 0;
 }
+.ui.label[class*="left icon"] > .close.icon.right,
+.ui.label[class*="left icon"] > .delete.icon.right {
+  margin: 0 0 0 0.5em;
+}
 .ui.label:not(.icon) > .close.icon,
 .ui.label:not(.icon) > .delete.icon {
   margin: 0 0 0 0.5em;
@@ -109,22 +110,20 @@ a.ui.label {
 }
 
 /* Right Side Icon */
-.ui.right.icon.label > .icon {
+.ui[class*="right icon"].label > .icon {
   margin: 0 0 0 0.75em;
 }
 
-/*-------------------
+/* -------------------
        Group
---------------------*/
-
+-------------------- */
 .ui.labels > .label {
   margin: 0 0.5em 0.5em 0;
 }
 
-/*-------------------
+/* -------------------
        Coupling
---------------------*/
-
+-------------------- */
 .ui.header > .ui.label {
   margin-top: -0.29165em;
 }
@@ -175,6 +174,7 @@ a.ui.label {
              Types
 *******************************/
 
+.ui.image.labels .label,
 .ui.image.label {
   width: auto;
   margin-top: 0;
@@ -182,15 +182,19 @@ a.ui.label {
   max-width: 9999px;
   vertical-align: baseline;
   text-transform: none;
-  background: #E8E8E8;
+  background: #e8e8e8;
   padding: 0.5833em 0.833em 0.5833em 0.5em;
   border-radius: 0;
-  -webkit-box-shadow: none;
-          box-shadow: none;
+  box-shadow: none;
 }
+.ui.image.labels .label.attached:not(.basic),
 .ui.image.label.attached:not(.basic) {
   padding: 0.5833em 0.833em 0.5833em 0.5em;
 }
+.ui.labels .image.label,
+.ui.image.labels .label {
+  margin-bottom: 0.5em;
+}
 .ui.image.label img {
   display: inline-block;
   vertical-align: top;
@@ -213,10 +217,9 @@ a.ui.label {
   border-bottom-left-radius: 0;
 }
 
-/*-------------------
-         Tag
---------------------*/
-
+/* -------------------
+             Tag
+    -------------------- */
 .ui.tag.labels .label,
 .ui.tag.label {
   margin-left: 1em;
@@ -224,55 +227,49 @@ a.ui.label {
   padding-left: 1.5em;
   padding-right: 1.5em;
   border-radius: 0 0 0 0;
-  -webkit-transition: none;
   transition: none;
 }
-.ui.tag.labels .label:before,
-.ui.tag.label:before {
+.ui.tag.labels .label::before,
+.ui.tag.label::before {
   position: absolute;
-  -webkit-transform: translateY(-50%) translateX(50%) rotate(-45deg);
-          transform: translateY(-50%) translateX(50%) rotate(-45deg);
+  transform: translateY(-50%) translateX(50%) rotate(-45deg);
   top: 50%;
   right: 100%;
-  content: '';
+  content: "";
   background-color: inherit;
   background-image: none;
   width: 1.56em;
   height: 1.56em;
-  -webkit-transition: none;
   transition: none;
 }
-.ui.tag.labels .label:after,
-.ui.tag.label:after {
+.ui.tag.labels .label::after,
+.ui.tag.label::after {
   position: absolute;
-  content: '';
+  content: "";
   top: 50%;
   left: -0.25em;
   margin-top: -0.25em;
-  background-color: #FFFFFF;
+  background-color: #fff;
   width: 0.5em;
   height: 0.5em;
-  -webkit-box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.3);
-          box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.3);
+  box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.3);
   border-radius: 500rem;
 }
-.ui.basic.tag.labels .label:before,
-.ui.basic.tag.label:before {
+.ui.basic.tag.labels .label::before,
+.ui.basic.tag.label::before {
   border-color: inherit;
   border-width: 1px 0 0 1px;
   border-style: inherit;
   right: calc(100% + 1px);
 }
-.ui.basic.tag.labels .label:after,
-.ui.basic.tag.label:after {
-  -webkit-box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.8);
-          box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.8);
+.ui.basic.tag.labels .label::after,
+.ui.basic.tag.label::after {
+  box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.8);
 }
 
-/*-------------------
-    Corner Label
---------------------*/
-
+/* -------------------
+        Corner Label
+    -------------------- */
 .ui.corner.label {
   position: absolute;
   top: 0;
@@ -280,11 +277,10 @@ a.ui.label {
   margin: 0;
   padding: 0;
   text-align: center;
-  border-color: #E8E8E8;
+  border-color: #e8e8e8;
   width: 4em;
   height: 4em;
   z-index: 1;
-  -webkit-transition: border-color 0.1s ease;
   transition: border-color 0.1s ease;
 }
 
@@ -292,7 +288,7 @@ a.ui.label {
 .ui.corner.label {
   background-color: transparent !important;
 }
-.ui.corner.label:after {
+.ui.corner.label::after {
   position: absolute;
   content: "";
   right: 0;
@@ -306,7 +302,6 @@ a.ui.label {
   border-bottom: 4em solid transparent;
   border-left: 0 solid transparent;
   border-right-color: inherit;
-  -webkit-transition: border-color 0.1s ease;
   transition: border-color 0.1s ease;
 }
 .ui.corner.label .icon {
@@ -321,11 +316,11 @@ a.ui.label {
 
 /* Left Corner */
 .ui.left.corner.label,
-.ui.left.corner.label:after {
+.ui.left.corner.label::after {
   right: auto;
   left: 0;
 }
-.ui.left.corner.label:after {
+.ui.left.corner.label::after {
   border-top: 4em solid transparent;
   border-right: 4em solid transparent;
   border-bottom: 0 solid transparent;
@@ -347,22 +342,19 @@ a.ui.label {
   left: -1px;
 }
 
-/*-------------------
-         Ribbon
-  --------------------*/
-
+/* -------------------
+           Ribbon
+    -------------------- */
 .ui.ribbon.label {
   position: relative;
   margin: 0;
-  min-width: -webkit-max-content;
-  min-width: -moz-max-content;
   min-width: max-content;
   border-radius: 0 0 0 0;
   border-color: rgba(0, 0, 0, 0.15);
 }
-.ui.ribbon.label:after {
+.ui.ribbon.label::after {
   position: absolute;
-  content: '';
+  content: "";
   top: 100%;
   left: 0;
   background-color: transparent;
@@ -411,11 +403,10 @@ a.ui.label {
 /* Right Ribbon */
 .ui[class*="right ribbon"].label {
   text-align: left;
-  -webkit-transform: translateX(-100%);
-          transform: translateX(-100%);
+  transform: translateX(-100%);
   border-radius: 0 0 0 0;
 }
-.ui[class*="right ribbon"].label:after {
+.ui[class*="right ribbon"].label::after {
   left: auto;
   right: 0;
   border-style: solid;
@@ -423,8 +414,22 @@ a.ui.label {
   border-color: transparent;
   border-top-color: inherit;
 }
+.ui.ui.center.ribbon.label {
+  top: calc(50% - 1em);
+  z-index: 1;
+}
+.ui.bottom.ribbon.label::after {
+  bottom: 100%;
+  top: auto;
+  border-width: 1.2em 1.2em 0 0;
+}
+.ui.bottom[class*="right ribbon"].label::after {
+  border-width: 1.2em 0 0 1.2em;
+  border-color: transparent;
+  border-left-color: inherit;
+}
 
-/* Inside Table */
+/* Inside Image */
 .ui.image > .ribbon.label,
 .ui.card .image > .ribbon.label {
   position: absolute;
@@ -439,6 +444,11 @@ a.ui.label {
   left: calc(100% + -0.05rem + 1.2em);
   padding-left: 0.833em;
 }
+.ui.card .image > .ui.bottom.ribbon.label,
+.ui.image > .ui.bottom.ribbon.label {
+  bottom: 1rem;
+  top: auto;
+}
 
 /* Inside Table */
 .ui.table td > .ui.ribbon.label {
@@ -449,10 +459,9 @@ a.ui.label {
   padding-left: 0.833em;
 }
 
-/*-------------------
-        Attached
-  --------------------*/
-
+/* -------------------
+          Attached
+    -------------------- */
 .ui[class*="top attached"].label,
 .ui.attached.label {
   width: 100%;
@@ -500,74 +509,68 @@ a.ui.label {
 *******************************/
 
 
-/*-------------------
+/* -------------------
       Disabled
---------------------*/
-
+-------------------- */
 
-/*-------------------
+/* -------------------
         Hover
---------------------*/
-
+-------------------- */
 .ui.labels a.label:hover,
 a.ui.label:hover {
-  background-color: #E0E0E0;
-  border-color: #E0E0E0;
+  background-color: #e0e0e0;
+  border-color: #e0e0e0;
   background-image: none;
   color: rgba(0, 0, 0, 0.8);
 }
-.ui.labels a.label:hover:before,
-a.ui.label:hover:before {
+.ui.labels a.label:hover::before,
+a.ui.label:hover::before {
   color: rgba(0, 0, 0, 0.8);
 }
 
-/*-------------------
+/* -------------------
         Active
---------------------*/
-
+-------------------- */
 .ui.active.label {
-  background-color: #D0D0D0;
-  border-color: #D0D0D0;
+  background-color: #d0d0d0;
+  border-color: #d0d0d0;
   background-image: none;
   color: rgba(0, 0, 0, 0.95);
 }
-.ui.active.label:before {
-  background-color: #D0D0D0;
+.ui.active.label::before {
+  background-color: #d0d0d0;
   background-image: none;
   color: rgba(0, 0, 0, 0.95);
 }
 
-/*-------------------
+/* -------------------
      Active Hover
---------------------*/
-
+-------------------- */
 .ui.labels a.active.label:hover,
 a.ui.active.label:hover {
-  background-color: #C8C8C8;
-  border-color: #C8C8C8;
+  background-color: #c8c8c8;
+  border-color: #c8c8c8;
   background-image: none;
   color: rgba(0, 0, 0, 0.95);
 }
-.ui.labels a.active.label:hover:before,
-a.ui.active.label:hover:before {
-  background-color: #C8C8C8;
+.ui.labels a.active.label:hover::before,
+a.ui.active.label:hover::before {
+  background-color: #c8c8c8;
   background-image: none;
   color: rgba(0, 0, 0, 0.95);
 }
 
-/*-------------------
+/* -------------------
       Visible
---------------------*/
-
+-------------------- */
 .ui.labels.visible .label,
 .ui.label.visible:not(.dropdown) {
   display: inline-block !important;
 }
 
-/*-------------------
+/* -------------------
       Hidden
---------------------*/
-
+-------------------- */
 .ui.labels.hidden .label,
 .ui.label.hidden {
   display: none !important;
@@ -579,17 +582,15 @@ a.ui.active.label:hover:before {
 *******************************/
 
 
-/*-------------------
-          Basic
-  --------------------*/
-
+/* -------------------
+            Basic
+    -------------------- */
 .ui.basic.labels .label,
 .ui.basic.label {
-  background: none #FFFFFF;
+  background: none #fff;
   border: 1px solid rgba(34, 36, 38, 0.15);
   color: rgba(0, 0, 0, 0.87);
-  -webkit-box-shadow: none;
-          box-shadow: none;
+  box-shadow: none;
   padding-top: calc(0.5833em - 1px);
   padding-bottom: calc(0.5833em - 1px);
   padding-right: calc(0.833em - 1px);
@@ -606,32 +607,32 @@ a.ui.active.label:hover:before {
 .ui.basic.labels a.label:hover,
 a.ui.basic.label:hover {
   text-decoration: none;
-  background: none #FFFFFF;
+  background: none #fff;
   color: #006274;
-  -webkit-box-shadow: none;
-          box-shadow: none;
+  box-shadow: none;
 }
 
 /* Pointing */
-.ui.basic.pointing.label:before {
+.ui.basic.pointing.label::before {
   border-color: inherit;
 }
 
-/*-------------------
-         Fluid
-  --------------------*/
-
+/* -------------------
+           Fluid
+    -------------------- */
 .ui.label.fluid,
 .ui.fluid.labels > .label {
   width: 100%;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
+  box-sizing: border-box;
+}
+.ui.centered.labels .label,
+.ui.centered.label {
+  text-align: center;
 }
 
-/*-------------------
+/* -------------------
        Colors
---------------------*/
-
+-------------------- */
 .ui.primary.labels .label,
 .ui.ui.ui.primary.label {
   background-color: #007388;
@@ -644,7 +645,7 @@ a.ui.basic.label:hover {
 a.ui.ui.ui.primary.label:hover {
   background-color: #005d6f;
   border-color: #005d6f;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -655,20 +656,20 @@ a.ui.ui.ui.primary.label:hover {
 /* Basic */
 .ui.basic.labels .primary.label,
 .ui.ui.ui.basic.primary.label {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #007388;
   color: #007388;
 }
 .ui.basic.labels a.primary.label:hover,
 a.ui.ui.ui.basic.primary.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #005d6f;
   color: #005d6f;
 }
 .ui.secondary.labels .label,
 .ui.ui.ui.secondary.label {
-  background-color: #1B1C1D;
-  border-color: #1B1C1D;
+  background-color: #1b1c1d;
+  border-color: #1b1c1d;
   color: rgba(255, 255, 255, 0.9);
 }
 
@@ -677,7 +678,7 @@ a.ui.ui.ui.basic.primary.label:hover {
 a.ui.ui.ui.secondary.label:hover {
   background-color: #27292a;
   border-color: #27292a;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -688,13 +689,13 @@ a.ui.ui.ui.secondary.label:hover {
 /* Basic */
 .ui.basic.labels .secondary.label,
 .ui.ui.ui.basic.secondary.label {
-  background: none #FFFFFF;
-  border-color: #1B1C1D;
-  color: #1B1C1D;
+  background: none #fff;
+  border-color: #1b1c1d;
+  color: #1b1c1d;
 }
 .ui.basic.labels a.secondary.label:hover,
 a.ui.ui.ui.basic.secondary.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #27292a;
   color: #27292a;
 }
@@ -702,7 +703,7 @@ a.ui.ui.ui.basic.secondary.label:hover {
 .ui.ui.ui.red.label {
   background-color: #af4e4a;
   border-color: #af4e4a;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Link */
@@ -710,7 +711,7 @@ a.ui.ui.ui.basic.secondary.label:hover {
 a.ui.ui.ui.red.label:hover {
   background-color: #a2423e;
   border-color: #a2423e;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -721,21 +722,21 @@ a.ui.ui.ui.red.label:hover {
 /* Basic */
 .ui.basic.labels .red.label,
 .ui.ui.ui.basic.red.label {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #af4e4a;
   color: #af4e4a;
 }
 .ui.basic.labels a.red.label:hover,
 a.ui.ui.ui.basic.red.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #a2423e;
   color: #a2423e;
 }
 .ui.orange.labels .label,
 .ui.ui.ui.orange.label {
-  background-color: #F2711C;
-  border-color: #F2711C;
-  color: #FFFFFF;
+  background-color: #f2711c;
+  border-color: #f2711c;
+  color: #fff;
 }
 
 /* Link */
@@ -743,7 +744,7 @@ a.ui.ui.ui.basic.red.label:hover {
 a.ui.ui.ui.orange.label:hover {
   background-color: #f26202;
   border-color: #f26202;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -754,21 +755,21 @@ a.ui.ui.ui.orange.label:hover {
 /* Basic */
 .ui.basic.labels .orange.label,
 .ui.ui.ui.basic.orange.label {
-  background: none #FFFFFF;
-  border-color: #F2711C;
-  color: #F2711C;
+  background: none #fff;
+  border-color: #f2711c;
+  color: #f2711c;
 }
 .ui.basic.labels a.orange.label:hover,
 a.ui.ui.ui.basic.orange.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #f26202;
   color: #f26202;
 }
 .ui.yellow.labels .label,
 .ui.ui.ui.yellow.label {
-  background-color: #FBBD08;
-  border-color: #FBBD08;
-  color: #FFFFFF;
+  background-color: #fbbd08;
+  border-color: #fbbd08;
+  color: #fff;
 }
 
 /* Link */
@@ -776,7 +777,7 @@ a.ui.ui.ui.basic.orange.label:hover {
 a.ui.ui.ui.yellow.label:hover {
   background-color: #eaae00;
   border-color: #eaae00;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -787,13 +788,13 @@ a.ui.ui.ui.yellow.label:hover {
 /* Basic */
 .ui.basic.labels .yellow.label,
 .ui.ui.ui.basic.yellow.label {
-  background: none #FFFFFF;
-  border-color: #FBBD08;
-  color: #FBBD08;
+  background: none #fff;
+  border-color: #fbbd08;
+  color: #fbbd08;
 }
 .ui.basic.labels a.yellow.label:hover,
 a.ui.ui.ui.basic.yellow.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #eaae00;
   color: #eaae00;
 }
@@ -801,7 +802,7 @@ a.ui.ui.ui.basic.yellow.label:hover {
 .ui.ui.ui.olive.label {
   background-color: #9baf66;
   border-color: #9baf66;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Link */
@@ -809,7 +810,7 @@ a.ui.ui.ui.basic.yellow.label:hover {
 a.ui.ui.ui.olive.label:hover {
   background-color: #91a952;
   border-color: #91a952;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -820,13 +821,13 @@ a.ui.ui.ui.olive.label:hover {
 /* Basic */
 .ui.basic.labels .olive.label,
 .ui.ui.ui.basic.olive.label {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #9baf66;
   color: #9baf66;
 }
 .ui.basic.labels a.olive.label:hover,
 a.ui.ui.ui.basic.olive.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #91a952;
   color: #91a952;
 }
@@ -834,7 +835,7 @@ a.ui.ui.ui.basic.olive.label:hover {
 .ui.ui.ui.green.label {
   background-color: #66af8b;
   border-color: #66af8b;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Link */
@@ -842,7 +843,7 @@ a.ui.ui.ui.basic.olive.label:hover {
 a.ui.ui.ui.green.label:hover {
   background-color: #52a97e;
   border-color: #52a97e;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -853,13 +854,13 @@ a.ui.ui.ui.green.label:hover {
 /* Basic */
 .ui.basic.labels .green.label,
 .ui.ui.ui.basic.green.label {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #66af8b;
   color: #66af8b;
 }
 .ui.basic.labels a.green.label:hover,
 a.ui.ui.ui.basic.green.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #52a97e;
   color: #52a97e;
 }
@@ -867,7 +868,7 @@ a.ui.ui.ui.basic.green.label:hover {
 .ui.ui.ui.teal.label {
   background-color: #66afac;
   border-color: #66afac;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Link */
@@ -875,7 +876,7 @@ a.ui.ui.ui.basic.green.label:hover {
 a.ui.ui.ui.teal.label:hover {
   background-color: #52a9a6;
   border-color: #52a9a6;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -886,13 +887,13 @@ a.ui.ui.ui.teal.label:hover {
 /* Basic */
 .ui.basic.labels .teal.label,
 .ui.ui.ui.basic.teal.label {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #66afac;
   color: #66afac;
 }
 .ui.basic.labels a.teal.label:hover,
 a.ui.ui.ui.basic.teal.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #52a9a6;
   color: #52a9a6;
 }
@@ -900,7 +901,7 @@ a.ui.ui.ui.basic.teal.label:hover {
 .ui.ui.ui.blue.label {
   background-color: #007388;
   border-color: #007388;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Link */
@@ -908,7 +909,7 @@ a.ui.ui.ui.basic.teal.label:hover {
 a.ui.ui.ui.blue.label:hover {
   background-color: #005d6f;
   border-color: #005d6f;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -919,13 +920,13 @@ a.ui.ui.ui.blue.label:hover {
 /* Basic */
 .ui.basic.labels .blue.label,
 .ui.ui.ui.basic.blue.label {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #007388;
   color: #007388;
 }
 .ui.basic.labels a.blue.label:hover,
 a.ui.ui.ui.basic.blue.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #005d6f;
   color: #005d6f;
 }
@@ -933,7 +934,7 @@ a.ui.ui.ui.basic.blue.label:hover {
 .ui.ui.ui.violet.label {
   background-color: #a166af;
   border-color: #a166af;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Link */
@@ -941,7 +942,7 @@ a.ui.ui.ui.basic.blue.label:hover {
 a.ui.ui.ui.violet.label:hover {
   background-color: #9852a9;
   border-color: #9852a9;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -952,13 +953,13 @@ a.ui.ui.ui.violet.label:hover {
 /* Basic */
 .ui.basic.labels .violet.label,
 .ui.ui.ui.basic.violet.label {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #a166af;
   color: #a166af;
 }
 .ui.basic.labels a.violet.label:hover,
 a.ui.ui.ui.basic.violet.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #9852a9;
   color: #9852a9;
 }
@@ -966,7 +967,7 @@ a.ui.ui.ui.basic.violet.label:hover {
 .ui.ui.ui.purple.label {
   background-color: #af6690;
   border-color: #af6690;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Link */
@@ -974,7 +975,7 @@ a.ui.ui.ui.basic.violet.label:hover {
 a.ui.ui.ui.purple.label:hover {
   background-color: #a95284;
   border-color: #a95284;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -985,21 +986,21 @@ a.ui.ui.ui.purple.label:hover {
 /* Basic */
 .ui.basic.labels .purple.label,
 .ui.ui.ui.basic.purple.label {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #af6690;
   color: #af6690;
 }
 .ui.basic.labels a.purple.label:hover,
 a.ui.ui.ui.basic.purple.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #a95284;
   color: #a95284;
 }
 .ui.pink.labels .label,
 .ui.ui.ui.pink.label {
-  background-color: #E03997;
-  border-color: #E03997;
-  color: #FFFFFF;
+  background-color: #e03997;
+  border-color: #e03997;
+  color: #fff;
 }
 
 /* Link */
@@ -1007,7 +1008,7 @@ a.ui.ui.ui.basic.purple.label:hover {
 a.ui.ui.ui.pink.label:hover {
   background-color: #e61a8d;
   border-color: #e61a8d;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -1018,13 +1019,13 @@ a.ui.ui.ui.pink.label:hover {
 /* Basic */
 .ui.basic.labels .pink.label,
 .ui.ui.ui.basic.pink.label {
-  background: none #FFFFFF;
-  border-color: #E03997;
-  color: #E03997;
+  background: none #fff;
+  border-color: #e03997;
+  color: #e03997;
 }
 .ui.basic.labels a.pink.label:hover,
 a.ui.ui.ui.basic.pink.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #e61a8d;
   color: #e61a8d;
 }
@@ -1032,7 +1033,7 @@ a.ui.ui.ui.basic.pink.label:hover {
 .ui.ui.ui.brown.label {
   background-color: #af9666;
   border-color: #af9666;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Link */
@@ -1040,7 +1041,7 @@ a.ui.ui.ui.basic.pink.label:hover {
 a.ui.ui.ui.brown.label:hover {
   background-color: #a98b52;
   border-color: #a98b52;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -1051,13 +1052,13 @@ a.ui.ui.ui.brown.label:hover {
 /* Basic */
 .ui.basic.labels .brown.label,
 .ui.ui.ui.basic.brown.label {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #af9666;
   color: #af9666;
 }
 .ui.basic.labels a.brown.label:hover,
 a.ui.ui.ui.basic.brown.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #a98b52;
   color: #a98b52;
 }
@@ -1065,7 +1066,7 @@ a.ui.ui.ui.basic.brown.label:hover {
 .ui.ui.ui.grey.label {
   background-color: #9ab5c1;
   border-color: #9ab5c1;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Link */
@@ -1073,7 +1074,7 @@ a.ui.ui.ui.basic.brown.label:hover {
 a.ui.ui.ui.grey.label:hover {
   background-color: #aac1cb;
   border-color: #aac1cb;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -1084,21 +1085,21 @@ a.ui.ui.ui.grey.label:hover {
 /* Basic */
 .ui.basic.labels .grey.label,
 .ui.ui.ui.basic.grey.label {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #9ab5c1;
   color: #9ab5c1;
 }
 .ui.basic.labels a.grey.label:hover,
 a.ui.ui.ui.basic.grey.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #aac1cb;
   color: #aac1cb;
 }
 .ui.black.labels .label,
 .ui.ui.ui.black.label {
-  background-color: #1B1C1D;
-  border-color: #1B1C1D;
-  color: #FFFFFF;
+  background-color: #1b1c1d;
+  border-color: #1b1c1d;
+  color: #fff;
 }
 
 /* Link */
@@ -1106,7 +1107,7 @@ a.ui.ui.ui.basic.grey.label:hover {
 a.ui.ui.ui.black.label:hover {
   background-color: #27292a;
   border-color: #27292a;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Ribbon */
@@ -1117,21 +1118,20 @@ a.ui.ui.ui.black.label:hover {
 /* Basic */
 .ui.basic.labels .black.label,
 .ui.ui.ui.basic.black.label {
-  background: none #FFFFFF;
-  border-color: #1B1C1D;
-  color: #1B1C1D;
+  background: none #fff;
+  border-color: #1b1c1d;
+  color: #1b1c1d;
 }
 .ui.basic.labels a.black.label:hover,
 a.ui.ui.ui.basic.black.label:hover {
-  background: none #FFFFFF;
+  background: none #fff;
   border-color: #27292a;
   color: #27292a;
 }
 
-/*-------------------
+/* -------------------
      Horizontal
---------------------*/
-
+-------------------- */
 .ui.horizontal.labels .label,
 .ui.horizontal.label {
   margin: 0 0.5em 0 0;
@@ -1140,10 +1140,9 @@ a.ui.ui.ui.basic.black.label:hover {
   text-align: center;
 }
 
-/*-------------------
-         Circular
-  --------------------*/
-
+/* -------------------
+           Circular
+    -------------------- */
 .ui.circular.labels .label,
 .ui.circular.label {
   min-width: 2em;
@@ -1163,17 +1162,16 @@ a.ui.ui.ui.basic.black.label:hover {
   vertical-align: baseline;
 }
 
-/*-------------------
-         Pointing
-  --------------------*/
-
+/* -------------------
+           Pointing
+    -------------------- */
 .ui.pointing.label {
   position: relative;
 }
 .ui.attached.pointing.label {
   position: absolute;
 }
-.ui.pointing.label:before {
+.ui.pointing.label::before {
   background-color: inherit;
   background-image: inherit;
   border-width: 0;
@@ -1182,78 +1180,67 @@ a.ui.ui.ui.basic.black.label:hover {
 }
 
 /* Arrow */
-.ui.pointing.label:before {
+.ui.pointing.label::before {
   position: absolute;
-  content: '';
-  -webkit-transform: rotate(45deg);
-          transform: rotate(45deg);
+  content: "";
+  transform: rotate(45deg);
   background-image: none;
   z-index: 2;
   width: 0.6666em;
   height: 0.6666em;
-  -webkit-transition: none;
   transition: none;
 }
 
-/*--- Above ---*/
-
+/* --- Above --- */
 .ui.pointing.label,
 .ui[class*="pointing above"].label {
   margin-top: 1em;
 }
-.ui.pointing.label:before,
-.ui[class*="pointing above"].label:before {
+.ui.pointing.label::before,
+.ui[class*="pointing above"].label::before {
   border-width: 1px 0 0 1px;
-  -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
-          transform: translateX(-50%) translateY(-50%) rotate(45deg);
+  transform: translateX(-50%) translateY(-50%) rotate(45deg);
   top: 0;
   left: 50%;
 }
 
-/*--- Below ---*/
-
+/* --- Below --- */
 .ui[class*="bottom pointing"].label,
 .ui[class*="pointing below"].label {
   margin-top: 0;
   margin-bottom: 1em;
 }
-.ui[class*="bottom pointing"].label:before,
-.ui[class*="pointing below"].label:before {
+.ui[class*="bottom pointing"].label::before,
+.ui[class*="pointing below"].label::before {
   border-width: 0 1px 1px 0;
-  top: auto;
   right: auto;
-  -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
-          transform: translateX(-50%) translateY(-50%) rotate(45deg);
+  transform: translateX(-50%) translateY(-50%) rotate(45deg);
   top: 100%;
   left: 50%;
 }
 
-/*--- Left ---*/
-
+/* --- Left --- */
 .ui[class*="left pointing"].label {
   margin-top: 0;
   margin-left: 0.6666em;
 }
-.ui[class*="left pointing"].label:before {
+.ui[class*="left pointing"].label::before {
   border-width: 0 0 1px 1px;
-  -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
-          transform: translateX(-50%) translateY(-50%) rotate(45deg);
+  transform: translateX(-50%) translateY(-50%) rotate(45deg);
   bottom: auto;
   right: auto;
   top: 50%;
   left: 0;
 }
 
-/*--- Right ---*/
-
+/* --- Right --- */
 .ui[class*="right pointing"].label {
   margin-top: 0;
   margin-right: 0.6666em;
 }
-.ui[class*="right pointing"].label:before {
+.ui[class*="right pointing"].label::before {
   border-width: 1px 1px 0 0;
-  -webkit-transform: translateX(50%) translateY(-50%) rotate(45deg);
-          transform: translateX(50%) translateY(-50%) rotate(45deg);
+  transform: translateX(50%) translateY(-50%) rotate(45deg);
   top: 50%;
   right: 0;
   bottom: auto;
@@ -1262,72 +1249,62 @@ a.ui.ui.ui.basic.black.label:hover {
 
 /* Basic Pointing */
 
-/*--- Above ---*/
-
-.ui.basic.pointing.label:before,
-.ui.basic[class*="pointing above"].label:before {
+/* --- Above --- */
+.ui.basic.pointing.label::before,
+.ui.basic[class*="pointing above"].label::before {
   margin-top: -1px;
 }
 
-/*--- Below ---*/
-
-.ui.basic[class*="bottom pointing"].label:before,
-.ui.basic[class*="pointing below"].label:before {
+/* --- Below --- */
+.ui.basic[class*="bottom pointing"].label::before,
+.ui.basic[class*="pointing below"].label::before {
   bottom: auto;
   top: 100%;
   margin-top: 1px;
 }
 
-/*--- Left ---*/
-
-.ui.basic[class*="left pointing"].label:before {
+/* --- Left --- */
+.ui.basic[class*="left pointing"].label::before {
   top: 50%;
   left: -1px;
 }
 
-/*--- Right ---*/
-
-.ui.basic[class*="right pointing"].label:before {
+/* --- Right --- */
+.ui.basic[class*="right pointing"].label::before {
   top: 50%;
   right: -1px;
 }
 
-/*------------------
-     Floating Label
-  -------------------*/
-
+/* ------------------
+       Floating Label
+    ------------------- */
 .ui.floating.label {
   position: absolute;
   z-index: 100;
   top: -1em;
   right: 0;
   white-space: nowrap;
-  -webkit-transform: translateX(50%);
-          transform: translateX(50%);
+  transform: translateX(50%);
 }
 .ui.right.aligned.floating.label {
-  -webkit-transform: translateX(1.2em);
-          transform: translateX(1.2em);
+  transform: translateX(1.2em);
 }
 .ui.left.floating.label {
   left: 0;
   right: auto;
-  -webkit-transform: translateX(-50%);
-          transform: translateX(-50%);
+  transform: translateX(-50%);
 }
 .ui.left.aligned.floating.label {
-  -webkit-transform: translateX(-1.2em);
-          transform: translateX(-1.2em);
+  transform: translateX(-1.2em);
 }
 .ui.bottom.floating.label {
   top: auto;
   bottom: -1em;
 }
 
-/*-------------------
+/* -------------------
         Sizes
---------------------*/
-
+-------------------- */
 .ui.labels .label,
 .ui.label {
   font-size: 0.85714286rem;