.topics-help {
  color: #8a8a8a;
  margin-top: -0.8rem !important;
}

#topics {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  word-break: break-all;
}

#topics > b:not(:first-of-type) {
  margin-left: 10px;
}

#topics, .topics-form {
  margin-bottom: 10px;
}

#categories {
  text-align: center;
}

#add-topic {
  cursor: pointer;
}

.ui.label.topic {
  font-weight: 500 !important;
  font-size: .775rem !important;
  line-height: 0.7rem !important;

  color: #fff;
  text-align:center;
  border: none;
  background-size: 300% 100%;

  border-radius: 50px;
  moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  -webkit-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
  box-shadow: 0 5px 15px rgba(255, 255, 255, 0.4);
}

.ui.label.topic:hover {
  background-position: 100% 0;
  moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  -webkit-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
  color: #fff;
}

.label.topic.category-task,
.label.topic.category-task:hover {
  background-image: linear-gradient(to right, #1c7b73, #268d84, #4c9d8f, #1c7b73) !important;
}

.label.topic.category-integration,
.label.topic.category-integration:hover {
  background-image: linear-gradient(to right,#cfcece,#ededed, #dedcdc, #c7c7c7) !important;
  color: grey;
}

.label.topic.category-type,
.label.topic.category-type:hover {
  background-image: linear-gradient(to right, #d039eb, #ca5ef1, #cb4ee1, #af37e2) !important;
}

.label.topic.category-data_domain,
.label.topic.category-data_domain:hover {
  background-image: linear-gradient(to right, #eb6b39, #f1995e, #e18e4e, #e28f37) !important;
}

.label.topic.category-framework,
.label.topic.category-framework:hover {
  background-image: linear-gradient(to right, #39adeb, #5ec2f1, #4ec4e1, #37c8e2) !important;
}

.label.topic.category-general,
.label.topic.category-general:hover {
  background-image: linear-gradient(to right, hsl(191deg 55% 14% / 60%), #485563, #2b5876, #4e4376) !important
}

/*More Color Ideas for future categories: */
/*background-image: linear-gradient(to right, rgb(171, 0, 0), rgb(255, 0, 0), rgba(255, 52, 52, 0.61), rgb(247, 58, 58)) !important;*/
/*background-image: linear-gradient(to right, #4dafe2bd, rgba(183, 61, 239, 0.62), rgba(242, 144, 40, 0.56), #f91ce1bf) !important;*/
/*background-image: linear-gradient(to right, rgb(142, 3, 103), rgb(237, 0, 233), rgb(242, 219, 35), rgb(255, 147, 5)) !important;*/

.repo-topic {
  height: 21px;
}

/* Simulate a link tag */
span.repo-topic {
  cursor: pointer;
}
