.bg-rainbow { 
	background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #dd00f3);

    -webkit-animation: rainbow 18s ease infinite;
    -z-animation: rainbow 18s ease infinite;
    -o-animation: rainbow 18s ease infinite;
    animation: rainbow 18s ease infinite;
}

@-webkit-keyframes rainbow {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@-moz-keyframes rainbow {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@-o-keyframes rainbow {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@keyframes rainbow { 
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}


.text-rainbow {
    background-image: repeating-linear-gradient(45deg, violet, indigo, blue, green, yellow, orange, red, violet);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: rainbow 18s ease infinite;
}

.hr-rainbow{
	height: 3px;
	background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #dd00f3);

	-webkit-animation: rainbow 18s ease infinite;
	-z-animation: rainbow 18s ease infinite;
	-o-animation: rainbow 18s ease infinite;
	  animation: rainbow 18s ease infinite;
}

.hr-slim-rainbow{
	height: 1px;
	background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #dd00f3);

	-webkit-animation: rainbow 18s ease infinite;
	-z-animation: rainbow 18s ease infinite;
	-o-animation: rainbow 18s ease infinite;
	  animation: rainbow 18s ease infinite;
}
.gradient-border {
  content: '';
  --borderWidth: 3px;
  background: #1D1F20;
  position: relative;
  border-radius: var(--borderWidth);
}
.gradient-border:after {
  content: '';
  position: absolute;
  top: calc(-1 * var(--borderWidth));
  left: calc(-1 * var(--borderWidth));
  height: calc(100% + var(--borderWidth) * 2);
  width: calc(100% + var(--borderWidth) * 2);
  background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
  border-radius: calc(2 * var(--borderWidth));
  z-index: -1;
	-webkit-animation: rainbow 18s ease infinite;
	-z-animation: rainbow 18s ease infinite;
	-o-animation: rainbow 18s ease infinite;
	  animation: rainbow 18s ease infinite;
  background-size: 300% 300%;
}

.border-rainbow{	
  --borderWidth: 2px;
	content: '';
	position: absolute;
    height: calc(100% + var(--borderWidth) * 2);
    width: calc(100% + var(--borderWidth) * 2);
	top: calc(-1 * var(--borderWidth));
	left: calc(-1 * var(--borderWidth));
	background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #dd00f3);
	border-radius: calc(2 * var(--borderWidth));
	z-index: 1;
	-webkit-animation: rainbow 18s ease infinite;
	-z-animation: rainbow 18s ease infinite;
	-o-animation: rainbow 18s ease infinite;
	  animation: rainbow 18s ease infinite;
	background-size: 300% 300%;
}