/*animacion 1*/
.text-focus-in {
    -webkit-animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
    animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;

}

@-webkit-keyframes text-focus-in {
    0% {
        -webkit-filter: blur(12px);
        filter: blur(12px);
        opacity: 0;
    }

    100% {
        -webkit-filter: blur(0px);
        filter: blur(0px);
        opacity: 1;
    }
}

@keyframes text-focus-in {
    0% {
        -webkit-filter: blur(12px);
        filter: blur(12px);
        opacity: 0;
    }

    100% {
        -webkit-filter: blur(0px);
        filter: blur(0px);
        opacity: 1;
    }
}

/*animacion 2*/
.bounce-top {
    animation: bounce-top 0.9s both;
}

@keyframes bounce-top {
    0% {
        transform: translateY(-45px);
        animation-timing-function: ease-in;
        opacity: 1;
    }

    24% {
        opacity: 1;
    }

    40% {
        transform: translateY(-24px);
        animation-timing-function: ease-in;
    }

    65% {
        transform: translateY(-12px);
        animation-timing-function: ease-in;
    }

    82% {
        transform: translateY(-6px);
        animation-timing-function: ease-in;
    }

    93% {
        transform: translateY(-4px);
        animation-timing-function: ease-in;
    }

    25%,
    55%,
    75%,
    87% {
        transform: translateY(0px);
        animation-timing-function: ease-out;
    }

    100% {
        transform: translateY(0px);
        animation-timing-function: ease-out;
        opacity: 1;
    }
}

/*animacion 3*/
.kenburns-right {
    animation: kenburns-right 5s ease-out both;
}

@keyframes kenburns-right {
    0% {
        transform: scale(1) translate(0, 0);
        transform-origin: 84% 50%;
    }

    100% {
        transform: scale(1.25) translateX(20px);
        transform-origin: right;
    }
}


/*animacion 4*/

.kenburns-left {
    animation: kenburns-left 5s ease-out both;
}

@keyframes kenburns-left {
    0% {
        transform: scale(1) translate(0, 0);
        transform-origin: 16% 50%;
    }

    100% {
        transform: scale(1.25) translate(-20px, 15px);
        transform-origin: left;
    }
}

/*animacion 5*/
.scale-in-center {
    animation: scale-in-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;

    view-timeline-name: --img !important;
    view-timeline-axis: block !important;

    animation-timeline: --img !important;
    animation-name: showImg !important;

    animation-range: entry 20% cover 30% !important;
    animation-fill-mode: both !important;
}


@keyframes showImg {
    0% {
        transform: scale(0);
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/*animacion 6*/
.tracking-in-expand-fwd {
    animation: tracking-in-expand-fwd 1s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;


}


@keyframes tracking-in-expand-fwd {
    0% {
        letter-spacing: -0.5em;
        transform: translateZ(-700px);
        opacity: 0;
    }

    40% {
        opacity: 0.6;
    }

    100% {
        transform: translateZ(0);
        opacity: 1;
    }

}

/*animacion 7*/
.text-shadow-drop-top {
    animation: text-shadow-drop-top 0.6s ease-in both !important;
    letter-spacing: 5px !important;

    view-timeline-name: --text !important;
    view-timeline-axis: block !important;

    animation-timeline: --text !important;
    animation-name: show !important;

    animation-range: entry 20% cover 30% !important;
    animation-fill-mode: both !important;
}


@keyframes show {
    from {
        opacity: 0;
        scale: 25%;

        text-shadow: 0 0 0 rgba(255, 255, 255, 0);
    }

    to {
        opacity: 1;
        scale: 100%;

        text-shadow: 0 -6px 18px rgba(0, 0, 0, 0.35);
    }
}

/*animacion 8*/
.slide-in-down {
    animation: slide-in-down 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;

    view-timeline-name: --text !important;
    view-timeline-axis: block !important;

    animation-timeline: --text !important;
    animation-name: showDown !important;

    animation-range: entry 20% cover 30% !important;
    animation-fill-mode: both !important;
}

@keyframes showDown {
    0% {
        transform: translatey(1000px);
        opacity: 0;
    }

    100% {
        transform: translatey(0);
        opacity: 1;
    }
}

/*animacion 9*/
.scale-in-hor-center {
    animation: scale-in-hor-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@keyframes scale-in-hor-center {
    0% {
        transform: scaleX(0);
        opacity: 1;
    }

    100% {
        transform: scaleX(1);
        opacity: 1;
    }
}


/*animacion 10*/
.kenburns-bottom {
    -webkit-animation: kenburns-bottom 5s ease-out both;
    animation: kenburns-bottom 5s ease-out both;
}

@-webkit-keyframes kenburns-bottom {
    0% {
        -webkit-transform: scale(1) translateY(0);
        transform: scale(1) translateY(0);
        -webkit-transform-origin: 50% 84%;
        transform-origin: 50% 84%;
    }

    100% {
        -webkit-transform: scale(1.25) translateY(15px);
        transform: scale(1.25) translateY(15px);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
    }
}

@keyframes kenburns-bottom {
    0% {
        -webkit-transform: scale(1) translateY(0);
        transform: scale(1) translateY(0);
        -webkit-transform-origin: 50% 84%;
        transform-origin: 50% 84%;
    }

    100% {
        -webkit-transform: scale(1.25) translateY(15px);
        transform: scale(1.25) translateY(15px);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
    }
}

/*animacion 11*/
.kenburns-top {
	-webkit-animation: kenburns-top 5s ease-out both;
	        animation: kenburns-top 5s ease-out both;
}


 @-webkit-keyframes kenburns-top {
    0% {
      -webkit-transform: scale(1) translateY(0);
              transform: scale(1) translateY(0);
      -webkit-transform-origin: 50% 16%;
              transform-origin: 50% 16%;
    }
    100% {
      -webkit-transform: scale(1.25) translateY(-15px);
              transform: scale(1.25) translateY(-15px);
      -webkit-transform-origin: top;
              transform-origin: top;
    }
  }
  @keyframes kenburns-top {
    0% {
      -webkit-transform: scale(1) translateY(0);
              transform: scale(1) translateY(0);
      -webkit-transform-origin: 50% 16%;
              transform-origin: 50% 16%;
    }
    100% {
      -webkit-transform: scale(1.25) translateY(-15px);
              transform: scale(1.25) translateY(-15px);
      -webkit-transform-origin: top;
              transform-origin: top;
    }
  }
  