/* Mixins */
.firework .btn {
  display: inline-block;
  border: initial;
  margin: 1em 0;
  padding: 1em 2em;
  background: transparent;
}

.firework .green span {
  background: -webkit-linear-gradient(left, #add356, #00dfa6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.firework .orange span {
  background: -webkit-linear-gradient(left, #ffcb52, #ff451f);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.firework .blue span {
  background: -webkit-linear-gradient(left, #3dade9, #bf2fcb);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.firework .blue {
  padding: .75em;
  letter-spacing: 1px;
}

/* Box-Shadow Technique */
.firework.box .green {
  box-shadow: -1px 0 0 1px rgba(173, 211, 86, 0.75), -1px -1px 0 1px rgba(130, 214, 106, 0.25), -1px 1px 0 1px rgba(130, 214, 106, 0.25), 0 -1px 0 1px rgba(87, 217, 126, 0.5), 0 1px 0 1px rgba(87, 217, 126, 0.5), 1px -1px 0 1px rgba(44, 220, 146, 0.25), 1px 1px 0 1px rgba(44, 220, 146, 0.25), 1px 0 0 1px rgba(0, 223, 166, 0.75);
}
.firework.box .orange {
  box-shadow: -1px 0 0 1px rgba(255, 203, 82, 0.75), -1px -1px 0 1px rgba(255, 170, 70, 0.25), -1px 1px 0 1px rgba(255, 170, 70, 0.25), 0 -1px 0 1px rgba(255, 136, 57, 0.5), 0 1px 0 1px rgba(255, 136, 57, 0.5), 1px -1px 0 1px rgba(255, 103, 44, 0.25), 1px 1px 0 1px rgba(255, 103, 44, 0.25), 1px 0 0 1px rgba(255, 69, 31, 0.75);
}
.firework.box .blue {
  box-shadow: -1px 0 0 1px rgba(61, 173, 233, 0.75), -1px -1px 0 1px rgba(94, 142, 226, 0.25), -1px 1px 0 1px rgba(94, 142, 226, 0.25), 0 -1px 0 1px rgba(126, 110, 218, 0.5), 0 1px 0 1px rgba(126, 110, 218, 0.5), 1px -1px 0 1px rgba(159, 79, 211, 0.25), 1px 1px 0 1px rgba(159, 79, 211, 0.25), 1px 0 0 1px rgba(191, 47, 203, 0.75);
}