/* Animations  */
/* Animations  */
/* Animations  */
/* Animations  */
/* Animations  */

.grow-1_3 {
  transform: scale(1.3);
  transition: transform 0.4s;
}

/* Pulse 5 times */
.pulse-5 {
  animation: pulse 0.5s ease-in 5;
}

@keyframes pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.14);
  }
  100% {
    transform: scale(1.6);
  }
}

@keyframes greenGlowPulseulse {
  0% {
    text-shadow: var(--my-green) 1px 1px 1px, var(--my-green) -1px -1px 1px,
      var(--my-green) 1px -1px 1px, var(--my-green) -1px 1px 1px;
  }
  100% {
    text-shadow: var(--my-green) 10px 10px 10px,
      var(--my-green) -10px -10px 10px, var(--my-green) 10px -10px 10px,
      var(--my-green) -10px 10px 10px;
  }
}

/* pulse and change color. animation shakes. */
.pulse {
  animation: pulseColor 0.5s ease-in infinite;
}

@keyframes pulseColor {
  0% {
    transform: scale(1);
    color: whitesmoke;
  }
  50% {
    transform: scale(1.14);
    color: rgb(217, 217, 233);
  }
  100% {
    transform: scale(1.6);
    color: rgb(0, 0, 255);
  }
}

.sidebarCollapse {
  animation: sideBColl 0.4s ease-out forwards;
}

@keyframes sideBColl {
  0% {
    opacity: 1;
  }
  50% {
    padding: 0px;
  }
  100% {
    max-width: 0px;
    opacity: 0;
    padding: 0px;
  }
}

.sidebarExpand {
  animation: sideBExp 0.4s ease-in normal;
}

@keyframes sideBExp {
  0% {
    max-width: 0px;
    opacity: 0;
    padding: 0px;
  }
  50% {
    padding: 0px;
  }
  100% {
    opacity: 1;
  }
}
