:root {
    --blocky-transition: cubic-bezier(0.165, 0.84, 0.44, 1)
}

body .blocky-animate-init {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) translateX(0) scale(1) rotate(0)
}

.blocky-animate {
    opacity: 0;
    visibility: hidden;
    transition-property: opacity, transform;
}

.blocky-move-up {
    transform: translateY(30px)
}

.blocky-move-down {
    transform: translateY(-30px)
}

.blocky-move-right {
    transform: translateX(-40px)
}

.blocky-move-left {
    transform: translateX(40px)
}

.blocky-flip {
    transform: perspective(500px) translateY(60px) scaleY(.75) rotateX(-40deg)
}

.blocky-scale {
    transform: scale(0.5)
}

.blocky-flip,
.blocky-move-down,
.blocky-move-up,
.blocky-move-right,
.blocky-move-left,
.blocky-scale {
    transition-duration: .7s;
    transition-timing-function: var(--blocky-transition)
}

.blocky-delay-1 {
    transition-delay: .1s
}

.blocky-delay-3 {
    transition-delay: .3s
}

.blocky-delay-5 {
    transition-delay: .5s
}

.blocky-delay-7 {
    transition-delay: .7s
}

.blocky-delay-10 {
    transition-delay: 1s
}

.blocky-delay-20 {
    transition-delay: 2s
}

.guten-element.guten-advanced-heading.blocky-animate .heading-title, 
.guten-element.guten-advanced-heading.blocky-animate .heading-line,
.guten-element.guten-advanced-heading.blocky-animate .heading-subtitle {
    opacity: 0;
    visibility: hidden;
    transition-property: opacity, transform;
    transform: translateX(-40px);
    transition-duration: .7s;
    transition-timing-function: var(--blocky-transition);
    transition-delay: .1s;
}
.guten-element.guten-advanced-heading.blocky-animate .heading-line,
.guten-element.guten-advanced-heading.blocky-animate .heading-subtitle {
    transition-delay: .3s;
}
.guten-element.guten-advanced-heading.blocky-animate.blocky-animate-init .heading-title,
.guten-element.guten-advanced-heading.blocky-animate.blocky-animate-init .heading-line,
.guten-element.guten-advanced-heading.blocky-animate.blocky-animate-init .heading-subtitle{
    opacity: 1;
    visibility: visible;
    transform: translateY(0) translateX(0) scale(1) rotate(0)
}

