:root {
	--ease-elastic-in-1:cubic-bezier(.5,-0.25,.75,1);
}		

.anim-blinker {
  	animation: anim-blinker 1s step-start infinite;
  	transform: translateZ(0); /*force GPU usage*/
}

.animate-button-1 {
    animation-name: animateButton1;
    animation-duration: 1.5s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}
    
.animate-button-2 {
    animation-name: animateButton2;
    animation-duration: 1.5s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}

.anim-breath {
    animation: anim-breath 1200ms infinite alternate;
}

.anim-glow-notifications {
  	animation: anim-glow-notifications 1700ms step-start infinite;
}

.anim-glow-button-text {
  	animation: anim-glow-text var(--ease-elastic-in-1) 1500ms infinite alternate;
}

.anim-glow-button-stroke {
  	animation: anim-glow-stroke var(--ease-elastic-in-1) 1500ms infinite alternate;
}

.anim-glow-button-fill {
  	animation: anim-glow-fill var(--ease-elastic-in-1) 1500ms infinite alternate;
}

@keyframes anim-blinker {
	
  50% {
    	opacity: 0;
  }
  
}

@keyframes anim-loading {  
  
  to {
    background-position: right -400px top 0;
  }
  
}

@keyframes animateButton1 {
  
    0% {
    	box-shadow: 0px 0px 10px 10px rgb(var(--theme-color-rgb-2) / 20%);
    }
    100% {
        box-shadow: inherit;
    }
    
}

@keyframes animateButton2 {
    
    0% {
    	box-shadow: 0px 0px 10px 10px rgb(var(--theme-color-rgb-2) / 20%);
    }
    100% {
        box-shadow: inherit;
    }
    
}

@keyframes anim-breath {
  	
  	from {
    	animation-timing-function: ease-out;
  	}
  	to {
    	transform: scale(1.25) translateY(-5px) perspective(1px);
    	animation-timing-function: ease-in-out;
  	}
  	
}

@keyframes anim-glow-notifications {
  	
  	50% {
  		color: #fff;
  		background-color: #cd0a0a;
	  	box-shadow: 0px 0px 5px 2px #cd0a0a;
  	}
  	
}

@keyframes anim-glow-text {
	
  	50% {
		color: var(--theme-color-4);
  	}
  	
}

@keyframes anim-glow-stroke {
	
  	50% {
    	stroke: var(--theme-color-4);
  	}
  	
}

@keyframes anim-glow-fill {
	
  	50% {
    	fill: var(--theme-color-4);
  	}
  	
}