@keyframes slide-down {
    0% {
        opacity: 0;
        transform: translateY(-100%);
    } 
    100% {
        opacity: 0.9;
        transform: translateY(0);
    } 
}
.animzoom{
    animation: zoomslide 25s forwards infinite;
}

@keyframes zoomslide {
  0% {
    transform: scale(1.6) rotate(-10deg);
  }
  50% {
    transform: scale(1) rotate(0deg);
  }
  100% {
    transform: scale(1.6) rotate(-10deg);
  }
}

@keyframes rotateReverse {
    0%{
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(-360deg);
    }
}

/* Animations éléments de base */
.animation-element-up, 
.animation-element_toogle-up, 
.animation-element-child-up>*, 
.animation-element_toogle-child-up>* {
    transform: translateY(-100px);
    opacity: 0;
    transition: all 0.6s;
}

.animation-element, 
.animation-element_toogle, 
.animation-element-child>*, 
.animation-element_toogle-child>*{
    transform: translateX(-100px);
    opacity: 0;
    transition: all 0.6s;
}

.animation-element_opacity, 
.animation-element_toogle-opacity {
    opacity: 0;
    transition: all 2s;
}

.animation-element_reverse, 
.animation-element_toogle-reverse{
    transform: translateX(100px);
    opacity: 0;
    transition: all 2s;
}

.animClass.in-view, 
.animClassChild.in-view>*, 
.animClassToogle.in-view, 
.animClassChildToogle.in-view>* {
    transform: translate(0px, 0px)!important;
    opacity: 1;
}
.animationDirection {
    position: relative;
    overflow: hidden;
}
.animationDirection::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--background-color);
    transition: all 0.5s;
    top: 0;
    z-index: 2;
}

.animationDirection.left::before{left: 0%;}
.animationDirection.left.in-view::before{left:-100%;}

.animationDirection.right::before{right: 0%;left: initial;}
.animationDirection.right.in-view::before{right: -100%;}

.animationDirection.top::before{top: 0%;}
.animationDirection.top.in-view::before{top:-100%;}

.animationDirection.bottom::before{bottom: 0%; top: initial;}
.animationDirection.bottom.in-view::before{bottom: -100%;}

.animationDirection.primary::before{background: var(--primary-color);}
.animationDirection.secondary::before{background: var(--secondary-color);}
.animationDirection.tertiary::before{background: var(--tertiary-color);}
.animationDirection.white::before{background: var(--white)}
.animationDirection.black::before{background: var(--black)}

/*----------------------------- delay    -----------------------------*/
.delay:nth-child(2), 
.animClassChild.delay>*:nth-child(2){transition-delay: 0.2s;}

.delay:nth-child(3), 
.animClassChild.delay>*:nth-child(3){transition-delay: 0.3s;}

.delay:nth-child(4), 
.animClassChild.delay>*:nth-child(4){transition-delay: 0.4s;}

.delay:nth-child(5), 
.animClassChild.delay>*:nth-child(5){transition-delay: 0.5s;}

.delay:nth-child(6), 
.animClassChild.delay>*:nth-child(6){transition-delay: 0.6s;}

.delay:nth-child(7), 
.animClassChild.delay>*:nth-child(7){transition-delay: 0.7s;}

.delay:nth-child(8), 
.animClassChild.delay>*:nth-child(8){transition-delay: 0.8s;}


/*----------------------------- overflow    -----------------------------*/
.animClass, 
.animClassChild, 
.animClassToogle, 
.animClassChildToogle {overflow: hidden;}

.animClass.in-view, 
.animClassChild.in-view, 
.animClassToogle.in-view, 
.animClassChildToogle.in-view {overflow: inherit;}

  @keyframes eltdfFadeInUp{
		0% {
		    opacity: 0;
		    -webkit-transform: translate3d(0,30%,0);
		    transform: translate3d(0,30%,0);
		}
		100% {
		    opacity: 1;
		    -webkit-transform: translate3d(0,0,0);
		    transform: translate3d(0,0,0);
		}
    }