:root {
  --animate-duration: 1s;
  --animate-delay: 1s;
  --animate-repeat: 1;

  --pulse-primary-a0: rgba(254, 197, 90, 0);
  --pulse-primary-a7: rgba(254, 197, 90, .7);

  --pulse-secondary-a0: rgba(108, 117, 125, 0);
  --pulse-secondary-a7: rgba(108, 117, 125, .7);

  --pulse-success-a0: rgba(25, 135, 84, 0);
  --pulse-success-a7: rgba(25, 135, 84, .7);

  --pulse-info-a0: rgba(13, 202, 240, 0);
  --pulse-info-a7: rgba(13, 202, 240, .7);

  --pulse-warning-a0: rgba(254, 197, 90, 0);
  --pulse-warning-a7: rgba(254, 197, 90, .7);

  --pulse-danger-a0: rgba(220, 53, 69, 0);
  --pulse-danger-a7: rgba(220, 53, 69, .7);

}

.animate__animated {
  -webkit-animation-duration: var(--animate-duration);
  animation-duration: var(--animate-duration);
  -webkit-animation-duration: var(--animate-duration);
  animation-duration: var(--animate-duration);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.pulse-infinite {
  animation-iteration-count: infinite !important;
}

@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.animate__headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake;
}

.pulse-primary, .pulse-secondary, .pulse-success, .pulse-info, .pulse-warning, .pulse-danger {
  position: relative;
  z-index: 996;
}

.pulse-primary {
  animation: pulse-primary 2s linear 1;
}

@keyframes pulse-primary {
  0% { box-shadow: 0 0 0 0 var(--pulse-primary-a7), 0 0 0 0 var(--pulse-primary-a7) }
  40% { box-shadow: 0 0 0 50px var(--pulse-primary-a0), 0 0 0 0 var(--pulse-primary-a0) }
  80% { box-shadow: 0 0 0 50px var(--pulse-primary-a0), 0 0 0 30px var(--pulse-primary-a0) }
  100% { box-shadow: 0 0 0 0 var(--pulse-primary-a0), 0 0 0 30px var(--pulse-primary-a0) }
}

.pulse-secondary {
  animation: pulse-secondary 2s linear 1;
}

@keyframes pulse-secondary {
  0% { box-shadow: 0 0 0 0 var(--pulse-secondary-a7), 0 0 0 0 var(--pulse-secondary-a7) }
  40% { box-shadow: 0 0 0 50px var(--pulse-secondary-a0), 0 0 0 0 var(--pulse-secondary-a0) }
  80% { box-shadow: 0 0 0 50px var(--pulse-secondary-a0), 0 0 0 30px var(--pulse-secondary-a0) }
  100% { box-shadow: 0 0 0 0 var(--pulse-secondary-a0), 0 0 0 30px var(--pulse-secondary-a0) }
}

.pulse-success {
  animation: pulse-success 2s linear 1;
}

@keyframes pulse-success {
  0% { box-shadow: 0 0 0 0 var(--pulse-success-a7), 0 0 0 0 var(--pulse-success-a7) }
  40% { box-shadow: 0 0 0 50px var(--pulse-success-a0), 0 0 0 0 var(--pulse-success-a0) }
  80% { box-shadow: 0 0 0 50px var(--pulse-success-a0), 0 0 0 30px var(--pulse-success-a0) }
  100% { box-shadow: 0 0 0 0 var(--pulse-success-a0), 0 0 0 30px var(--pulse-success-a0) }
}

.pulse-info {
  animation: pulse-info 2s linear 1;
}

@keyframes pulse-info {
  0% { box-shadow: 0 0 0 0 var(--pulse-info-a7), 0 0 0 0 var(--pulse-info-a7) }
  40% { box-shadow: 0 0 0 50px var(--pulse-info-a0), 0 0 0 0 var(--pulse-info-a0) }
  80% { box-shadow: 0 0 0 50px var(--pulse-info-a0), 0 0 0 30px var(--pulse-info-a0) }
  100% { box-shadow: 0 0 0 0 var(--pulse-info-a0), 0 0 0 30px var(--pulse-info-a0) }
}

.pulse-warning {
  animation: pulse-warning 2s linear 1;
}

@keyframes pulse-warning {
  0% { box-shadow: 0 0 0 0 var(--pulse-warning-a7), 0 0 0 0 var(--pulse-warning-a7) }
  40% { box-shadow: 0 0 0 50px var(--pulse-warning-a0), 0 0 0 0 var(--pulse-warning-a0) }
  80% { box-shadow: 0 0 0 50px var(--pulse-warning-a0), 0 0 0 30px var(--pulse-warning-a0) }
  100% { box-shadow: 0 0 0 0 var(--pulse-warning-a0), 0 0 0 30px var(--pulse-warning-a0) }
}

.pulse-danger {
  animation: pulse-danger 2s linear 1;
}

@keyframes pulse-danger {
  0% { box-shadow: 0 0 0 0 var(--pulse-danger-a7), 0 0 0 0 var(--pulse-danger-a7) }
  40% { box-shadow: 0 0 0 50px var(--pulse-danger-a0), 0 0 0 0 var(--pulse-danger-a0) }
  80% { box-shadow: 0 0 0 50px var(--pulse-danger-a0), 0 0 0 30px var(--pulse-danger-a0) }
  100% { box-shadow: 0 0 0 0 var(--pulse-danger-a0), 0 0 0 30px var(--pulse-danger-a0) }
}

.no-animation {
  -o-transition-property: none !important;
  -moz-transition-property: none !important;
  -ms-transition-property: none !important;
  -webkit-transition-property: none !important;
  transition-property: none !important;
  -o-transform: none !important;
  -moz-transform: none !important;
  -ms-transform: none !important;
  -webkit-transform: none !important;
  transform: none !important;
  -webkit-animation: none !important;
  -moz-animation: none !important;
  -o-animation: none !important;
  -ms-animation: none !important;
  animation: none !important;
}
