/* Fade in keyframes */

.fadein {
opacity: 0;
transition: all 1.5s;
transform: translate(0, 100px);
animation-delay: 1.5s;
}
.fadein.visible {
opacity: 1;
transform: translate(0, 0);
}
.fadein.right{
opacity: 0;
transition: all 1.5s;
animation-delay: 1.5s;
transform: translateX(100px);	
}
.fadein.right.visible {
opacity: 1;
transform: translate(0, 0);
}
.fadein.left {
opacity: 0;
transition: all 1.5s;
animation-delay: 1.5s;
transform: translateX(-500px);
}
.fadein.left.visible {
opacity: 1;
transform: translate(0, 0);
}

/* Fade in Right */

@keyframes fadeInRight 
{
from {
opacity: 0;
transform: translateX(100px);
}
 to {
opacity: 1;
}
}
@keyframes fadeInLeft 
{
from {
opacity: 0;
transform: translateX(-500px);
}
 to {
opacity: 1;
}
}


.heartbeat {
-webkit-animation: heartbeat 3.5s ease-in-out infinite both;
animation: heartbeat 3.5s ease-in-out infinite both;
}


/* ----------------------------------------------
 * Generated by Animista on 2024-4-9 14:20:21
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation heartbeat
 * ----------------------------------------
 */
@-webkit-keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
@keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}