How to change the Category abbreviation using CSS

In case someone else needs to change the category abbreviation using CSS. YOu can target the box and abbreviation and replace it with your own abbreviation using the below CSS code. It took me a while to figure it out so I didnt want to keep it to my self.

.category-box.category-box-CATEGORYSLUGHERE .category-box-inner .category-logo.no-logo-present .category-abbreviation {
  visibility: hidden;
  position: relative;
}

.category-box.category-box-CATEGORYSLUGHERE .category-box-inner .category-logo.no-logo-present .category-abbreviation::after {
  content: "NEWABBREVIATIONHERE";
  visibility: visible;
  position: absolute;
  top: 0;
  left: 0;
}