.tag_red {
  background: red;
  border-radius: 3px;
  color: white;
  display: inline-block;
  height: 26px;
  line-height: 26px;
  padding: 0 10px 0 10px;
  position: relative;
  margin: 0 10px 10px 0;
  text-decoration: none;
  -webkit-transition: color 0.2s;
  text-shadow: 1px 1px black ;
  
  
}

.tag_red:hover {
  background-color: #bc0101;
  color: white;
}

.tag_red:hover::after {
   border-left-color: #bc0101; 
}

.tag_red:visited {
    color: white;
}

.tag_red:focus {
    color: yellow;
}

/* ORANGE */

.tag_orange {
  background: orange ;
  border-radius: 3px;
  color: white;
  display: inline-block;
  height: 26px;
  line-height: 26px;
   padding: 0 10px 0 10px;
  position: relative;
  margin: 0 10px 10px 0;
  text-decoration: none;
  -webkit-transition: color 0.2s;
  text-shadow: 1px 1px black ;
}

/*
.tag_orange::before {
  background: #fff;
  border-radius: 10px;
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
  content: '';
  height: 6px;
  left: 10px;
  position: absolute;
  width: 6px;
  top: 10px;
}

.tag_orange::after {
  background: #fff;
  border-bottom: 13px solid transparent;
  border-left: 10px solid orange ;
  border-top: 13px solid transparent;
  content: '';
  position: absolute;
  right: 0;
  top: 0;
}
*/

.tag_orange:hover {
  background-color: #e67e00  ;
  color: yellow;
}

.tag_orange:hover::after {
   border-left-color: #e67e00  ; 
}

.tag_orange:visited {
    color: white;
}

/* gray */

.tag_gray {
  background: gray ;
  border-radius: 3px;
  color: white;
  display: inline-block;
  height: 26px;
  line-height: 26px;
  padding: 0 10px 0 10px;
  position: relative;
  margin: 0 10px 10px 0;
  text-decoration: none;
  -webkit-transition: color 0.2s;
  text-shadow: 1px 1px black ;
}

/*
.tag_gray::before {
  background: #fff;
  border-radius: 10px;
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
  content: '';
  height: 6px;
  left: 10px;
  position: absolute;
  width: 6px;
  top: 10px;
}

.tag_gray::after {
  background: #fff;
  border-bottom: 13px solid transparent;
  border-left: 10px solid gray ;
  border-top: 13px solid transparent;
  content: '';
  position: absolute;
  right: 0;
  top: 0;
}
*/
.tag_gray:hover {
  background-color: darkgray  ;
  color: white;
}

.tag_gray:hover::after {
   border-left-color: darkgray  ; 
}

.tag_gray:visited {
    color: white;
}

/* cc0099 */

.tag_mag {
  background: #cc0099 ;
  border-radius: 3px;
  color: white;
  display: inline-block;
  height: 26px;
  line-height: 26px;
  padding: 0 10px 0 10px;
  position: relative;
  margin: 0 10px 10px 0;
  text-decoration: none;
  -webkit-transition: color 0.2s;
  text-shadow: 1px 1px black ;
}

.tag_mag:hover {
  background-color: #990073  ;
  color: white;
}

.tag_mag:hover::after {
   border-left-color: #990073  ; 
}

.tag_mag:visited {
    color: white;
}


/* BLUE */

.tag_blue {
  background: DodgerBlue;
  border-radius: 3px;
  color: yellow;
  display: inline-block;
  height: 26px;
  line-height: 26px;
  padding: 0 20px 0 23px;
  position: relative;
  margin: 0 10px 10px 0;
  text-decoration: none;
  -webkit-transition: color 0.2s;
  text-shadow: 1px 1px black ;
}

/*
.tag_blue::before {
  background: #fff;
  border-radius: 10px;
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
  content: '';
  height: 6px;
  left: 10px;
  position: absolute;
  width: 6px;
  top: 10px;
}

.tag_blue::after {
  background: #fff;
  border-bottom: 13px solid transparent;
  border-left: 10px solid DodgerBlue;
  border-top: 13px solid transparent;
  content: '';
  position: absolute;
  right: 0;
  top: 0;
}
*/

.tag_blue:hover {
  background-color: MediumBlue ;
  color: white;
}

.tag_blue:hover::after {
   border-left-color: MediumBlue ; 
}

.tag_blue:visited {
    color: white;
}

/* GREEN */

.tag_green {
  background: ForestGreen ;
  border-radius: 3px;
  color: white;
  display: inline-block;
  height: 26px;
  line-height: 26px;
  padding: 0 10px 0 10px;
  position: relative;
  margin: 0 10px 10px 0;
  text-decoration: none;
  -webkit-transition: color 0.2s;
  text-shadow: 1px 1px black ;
}




.tag_green:hover {
  background-color: DarkGreen  ;
  color: white;
}

.tag_green:hover::after {
   border-left-color: DarkGreen  ; 
}

.tag_green:visited {
    color: white;
}

/* BROWN */

.tag_brown {
  background: brown ;
  border-radius: 3px 0 0 3px;
  color: yellow;
  display: inline-block;
  height: 26px;
  line-height: 26px;
  padding: 0 20px 0 23px;
  position: relative;
  margin: 0 10px 10px 0;
  text-decoration: none;
  -webkit-transition: color 0.2s;
  text-shadow: 1px 1px black ;
}

.tag_brown::before {
  background: #fff;
  border-radius: 10px;
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
  content: '';
  height: 6px;
  left: 10px;
  position: absolute;
  width: 6px;
  top: 10px;
}

.tag_brown::after {
  background: #fff;
  border-bottom: 13px solid transparent;
  border-left: 10px solid brown ;
  border-top: 13px solid transparent;
  content: '';
  position: absolute;
  right: 0;
  top: 0;
}

.tag_brown:hover {
  background-color: SaddleBrown;
  color: white;
}

.tag_brown:hover::after {
   border-left-color: SaddleBrown; 
}

.tag_brown:visited {
    color: white;
}