
.ealain-text-showcase{
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    text-align: center;
}
.ealain-text-showcase .highlighted-images-box{position: relative;}
.ealain-text-showcase .highlighted-images-box .highlighted-image{
    position: relative;
    display: flex;
}
.ealain-text-showcase .highlighted-images-box .highlighted-image.pulse{
    animation: rotate-sun 50s ease infinite, pulse 1.5s ease-in-out infinite alternate;
}
.ealain-text-showcase .highlighted-images-box .highlighted-image.bounce{
    animation: bounce 2s ease infinite;
}
.ealain-text-showcase .highlighted-images-box .highlighted-image.shake{
    animation: shake 2s ease infinite;
}

.ealain-text-showcase .highlighted-images-box{
    display: inline-block;
    margin: -0.25em 0.5em 0 0;
}

.ealain-text-showcase  .ealain-text-title{
   font-size: var(--font-size-h2);
   letter-spacing: var(--font-letter-spacing-h2);
   line-height: var(--font-line-height-h2);
    text-transform: capitalize;
    color: var(--color-theme-white);
    font-weight: var(--font-weight-h2);
    font-family: var(--highlight-font-family);
}

.ealain-text-showcase  .ealain-text-title {
    margin: 0 0.5em 0 0;
    padding: 0 0 0 0;
}
.ealain-text-showcase .highlighted-images-box {
    margin: 0 2em 0 0;
    padding: 0 0 0 0;
}
.ealain-text-showcase:hover .highlighted-image.wavey-effect.wave img {
    animation: 2s down-enter;
}

@media(max-width: 767px) {
    .ealain-text-showcase{
        justify-content: center;
    }
    .ealain-text-showcase .ealain-text-title, .ealain-text-showcase .highlighted-images-box{
        margin: 0 0.5em 0.5em 0;
    }
}
@media(max-width: 480px) {
    .ealain-text-showcase .highlighted-images-box {
        display: none;
    }
}

/**************Animation***********/
@keyframes wave-effect {

    from{
      stroke-dashoffset: 100;
    }
  
    to {
      stroke-dashoffset: 0;
    }
  }

  @keyframes down-enter {
    0% { clip-path: inset(0 100% 0 0); }
    100% { clip-path: inset(0); }
  }

  @keyframes shake{
    0%, 100%, 48% {
      transform: translate(0,0) rotate(0);
  }
  3% {
      transform: translate(1px,0) rotate(0);
  }
  6% {
      transform: translate(-1px,-3px) rotate(-1deg);
  }
  9% {
      transform: translate(-3px,-1px) rotate(1deg);
  }
  12% {
      transform: translate(3px,1px) rotate(0);
  }
  15% {
      transform: translate(1px,-2px) rotate(1deg);
  }
  18% {
      transform: translate(-1px,1px) rotate(-1deg);
  }
  21% {
      transform: translate(3px,0) rotate(-1deg);
  }
  24% {
      transform: translate(-1px,-2px) rotate(1deg);
  }
  27% {
      transform: translate(1px,1px) rotate(0);
  }
  30% {
      transform: translate(1px,-3px) rotate(-1deg);
  }
  }
  @keyframes bounce {
    0% {
        transform: translateY(0);
        opacity: 1;
    }
    50% {
        transform: translateY(20px);
        opacity: 1;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
  }
  
  @keyframes pulse {
    from { transform: scale(0.9); }
    to { transform: scale(1); }
  }


