.bg-gradient-white {
  color: #fff;
  background-image: -webkit-linear-gradient(
    60deg,
    #fff,
    rgba(255, 255, 255, 0.5)
  );
  background-image: linear-gradient(30deg, #fff, rgba(255, 255, 255, 0.5));
  background-repeat: repeat-x;
}
.bg-gradient-white:active,
.bg-gradient-white:hover {
  color: #fff;
}
.gradient-light-white {
  background: -webkit-linear-gradient(60deg, #fff 0, 100%);
  background: linear-gradient(30deg, #fff 0, 100%);
  color: #fff;
}
.gradient-light-white:active,
.gradient-light-white:hover {
  color: #fff;
}
.bg-gradient-black {
  color: #fff;
  background-image: -webkit-linear-gradient(60deg, #000, rgba(0, 0, 0, 0.5));
  background-image: linear-gradient(30deg, #000, rgba(0, 0, 0, 0.5));
  background-repeat: repeat-x;
}
.bg-gradient-black:active,
.bg-gradient-black:hover {
  color: #fff;
}
.gradient-light-black {
  background: -webkit-linear-gradient(60deg, #000 0, 100%);
  background: linear-gradient(30deg, #000 0, 100%);
  color: #fff;
}
.gradient-light-black:active,
.gradient-light-black:hover {
  color: #fff;
}
.bg-gradient-dark {
  background: repeat-x #640064;
  color: #fff;
  background-image: -webkit-linear-gradient(
    60deg,
    #1e1e1e,
    rgba(30, 30, 30, 0.5)
  );
  background-image: linear-gradient(30deg, #1e1e1e, rgba(30, 30, 30, 0.5));
}
.bg-gradient-dark:active,
.bg-gradient-dark:hover {
  color: #fff;
}
.gradient-light-dark {
  background: -webkit-linear-gradient(60deg, #1e1e1e 0, 100%);
  background: linear-gradient(30deg, #1e1e1e 0, 100%);
  color: #fff;
}
.gradient-light-dark:active,
.gradient-light-dark:hover {
  color: #fff;
}
.bg-gradient-light {
  background: repeat-x #640064;
  color: #fff;
  background-image: -webkit-linear-gradient(
    60deg,
    #babfc7,
    rgba(186, 191, 199, 0.5)
  );
  background-image: linear-gradient(30deg, #babfc7, rgba(186, 191, 199, 0.5));
}
.bg-gradient-light:active,
.bg-gradient-light:hover {
  color: #fff;
}
.gradient-light-light {
  background: -webkit-linear-gradient(60deg, #babfc7 0, 100%);
  background: linear-gradient(30deg, #babfc7 0, 100%);
  color: #fff;
}
.gradient-light-light:active,
.gradient-light-light:hover {
  color: #fff;
}
.bg-gradient-primary {
  background: repeat-x #640064;
  color: #fff;
  background-image: -webkit-linear-gradient(
    60deg,
    #7367f0,
    rgba(115, 103, 240, 0.5)
  );
  background-image: linear-gradient(30deg, #7367f0, rgba(115, 103, 240, 0.5));
}
.bg-gradient-primary:active,
.bg-gradient-primary:hover {
  color: #fff;
}
.gradient-light-primary {
  background: -webkit-linear-gradient(60deg, #7367f0 0, #ce9ffc 100%);
  background: linear-gradient(30deg, #7367f0 0, #ce9ffc 100%);
  color: #fff;
}
.gradient-light-primary:active,
.gradient-light-primary:hover {
  color: #fff;
}
.bg-gradient-secondary {
  background: repeat-x #640064;
  color: #fff;
  background-image: -webkit-linear-gradient(
    60deg,
    #b8c2cc,
    rgba(184, 194, 204, 0.5)
  );
  background-image: linear-gradient(30deg, #b8c2cc, rgba(184, 194, 204, 0.5));
}
.bg-gradient-secondary:active,
.bg-gradient-secondary:hover {
  color: #fff;
}
.gradient-light-secondary {
  background: -webkit-linear-gradient(60deg, #b8c2cc 0, #dcdeec 100%);
  background: linear-gradient(30deg, #b8c2cc 0, #dcdeec 100%);
  color: #fff;
}
.gradient-light-secondary:active,
.gradient-light-secondary:hover {
  color: #fff;
}
.bg-gradient-success {
  background: repeat-x #0064fa;
  color: #fff;
  background-image: -webkit-linear-gradient(
    60deg,
    #28c76f,
    rgba(40, 199, 111, 0.5)
  );
  background-image: linear-gradient(30deg, #28c76f, rgba(40, 199, 111, 0.5));
}
.bg-gradient-success:active,
.bg-gradient-success:hover {
  color: #fff;
}
.gradient-light-success {
  background: -webkit-linear-gradient(60deg, #28c76f 0, #4ae9d3 100%);
  background: linear-gradient(30deg, #28c76f 0, #4ae9d3 100%);
  color: #fff;
}
.gradient-light-success:active,
.gradient-light-success:hover {
  color: #fff;
}
.bg-gradient-info {
  background: repeat-x #640064;
  color: #fff;
  background-image: -webkit-linear-gradient(
    60deg,
    #00cfe8,
    rgba(0, 207, 232, 0.5)
  );
  background-image: linear-gradient(30deg, #00cfe8, rgba(0, 207, 232, 0.5));
}
.bg-gradient-info:active,
.bg-gradient-info:hover {
  color: #fff;
}
.gradient-light-info {
  background: -webkit-linear-gradient(60deg, #00cfe8 0, #2d91ff 100%);
  background: linear-gradient(30deg, #00cfe8 0, #2d91ff 100%);
  color: #fff;
}
.gradient-light-info:active,
.gradient-light-info:hover {
  color: #fff;
}
.bg-gradient-warning {
  background: repeat-x #fafafa;
  color: #fff;
  background-image: -webkit-linear-gradient(
    60deg,
    #ff9f43,
    rgba(255, 159, 67, 0.5)
  );
  background-image: linear-gradient(30deg, #ff9f43, rgba(255, 159, 67, 0.5));
}
.bg-gradient-warning:active,
.bg-gradient-warning:hover {
  color: #fff;
}
.gradient-light-warning {
  background: -webkit-linear-gradient(60deg, #ff9f43 0, #fff487 100%);
  background: linear-gradient(30deg, #ff9f43 0, #fff487 100%);
  color: #fff;
}
.gradient-light-warning:active,
.gradient-light-warning:hover {
  color: #fff;
}
.bg-gradient-danger {
  background: repeat-x #640064;
  color: #fff;
  background-image: -webkit-linear-gradient(
    60deg,
    #ea5455,
    rgba(234, 84, 85, 0.5)
  );
  background-image: linear-gradient(30deg, #ea5455, rgba(234, 84, 85, 0.5));
}
.bg-gradient-danger:active,
.bg-gradient-danger:hover {
  color: #fff;
}
.gradient-light-danger {
  background: -webkit-linear-gradient(60deg, #ea5455 0, #f9b789 100%);
  background: linear-gradient(30deg, #ea5455 0, #f9b789 100%);
  color: #fff;
}
.gradient-light-danger:active,
.gradient-light-danger:hover {
  color: #fff;
}