/*
* animations.css
* Purpose: Base file for all CSS animations on site (not specific to classes).
* *****************************************************************************
  06.14.2021-WF:  Created File
  06.23.2021-WF:  Addition of .animate-once
  07.14.2021-WF:  Addition of undln-leftToRight during compl.css cleanup
**************************************************************************** */
/* --- Plays only once --- */
.animate-once {
    -webkit-animation-iteration-count: 1;
    -moz-animation-iteration-count: 1;
    animation-iteration-count: 1;
}

/* *********************** ENTRANCES ANIMATIONS ***************************** */
/* --- Fade In --- */
@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  -moz-animation-name: fade;
  -moz-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}
/* --- End: Fade In --- */

/* --- Flash --- */
@-webkit-keyframes flash {
    from {opacity: 1}
    25% {opacity: 0}
    50% {opacity: 1}
    75% {opacity: 0}
    to {opacity: 1}
}

@keyframes flash {
    from {opacity: 1}
    25% {opacity: 0}
    50% {opacity: 1}
    75% {opacity: 0}
    to {opacity: 1}
}

.flash {
  -webkit-animation-name: flash;
  -webkit-animation-duration: 1.25s;
  -moz-animation-name: flash;
  -moz-animation-duration: 1.25s;
  animation-name: flash;
  animation-duration: 1.25s;
}
/* --- End: Flash --- */

/* ********************** INFINITE/PASSIVE ANIMATIONS *********************** */
@-webkit-keyframes goldenRatio {
    to { transform: rotate(360deg); }
}
@keyframes goldenRatio {
    to { transform: rotate(360deg); }
}

.goldenRatio {
    -webkit-animation: goldenRatio 10000ms linear infinite;
    -moz-animation: goldenRatio 10000ms linear infinite;
    animation: goldenRatio 10000ms linear infinite;
}

/* ************************ HOVER ANIMATIONS ******************************** */

.pulse:hover, .pulse:focus {
	 animation: pulse 0.5s linear forwards;
     animation-iteration-count: 1;
	 box-shadow: 0 0 0 2em rgba(118, 225, 241, 0.5);
}
 @keyframes pulse {
	0% {
		 box-shadow: 0 0 0 0;
	}
    100% {
         box-shadow: 0 0 0 0.3em transparent;
    }
}

/* --- Underline (undln) - Left-To-Right --- */
.undln-leftToRight a {
    overflow: hidden;
	display: block;
	position: relative;
	padding: 0.2em 0;
}

.undln-leftToRight a::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #aaa;
	opacity: 0;
	transition: opacity 300ms, transform 300ms;
}

.undln-leftToRight a::after, a:focus::after {
    opacity: 1;
	transform: translate3d(0, 0.2em, 0);
}
.undln-leftToRight a::after { transform: translate3d(-100%, 0, 0); }
.undln-leftToRight a:hover::after, .undln-leftToRight a:focus::after { transform: translate3d(0, 0, 0); }
/* --- End Underline - Left-To-Right --- */

/* --- Wiggle --- */
@-webkit-keyframes wiggle {
    0% { transform: rotate(0deg); }
   80% { transform: rotate(0deg); }
   85% { transform: rotate(15deg); }
   95% { transform: rotate(-15deg); }
  100% { transform: rotate(0deg); }
}

@keyframes wiggle {
    0% { transform: rotate(0deg); }
   80% { transform: rotate(0deg); }
   85% { transform: rotate(15deg); }
   95% { transform: rotate(-15deg); }
  100% { transform: rotate(0deg); }
}

.wiggle {
	-webkit-animation: ease-out none;
	animation: ease-out none;
}

.wiggle:hover {
	-webkit-animation: wiggle 0.5s infinite;
	animation: wiggle 0.5s infinite;
}
/* --- End wiggle --- */

/* --- Zoom - In --- */
@-webkit-keyframes zoom-in {
   0% { transform: scale(1); }
  100% { transform: scale(1.3); }
}

@keyframes zoom-in {
   0% { transform: scale(1); }
  100% { transform: scale(1.3); }
}

.zoom-in {
	-webkit-animation-name: zoom-in;
	-webkit-animation: none;
	animation-name: zoom-in;
	animation: none;
	transition: 0.3s ease-in-out 0s !important;
}

.zoom-in:hover {
	-webkit-animation: zoom-in 0.5s;
	animation: zoom-in 0.5s;
	animation-fill-mode: forwards;
    z-index: 90;
}
/* --- End Zoom - In --- */