/* === ANIMATIONS === */
.animation{
    opacity:0;
    transform:translateY(40px);
    transition:
        opacity .8s ease,
        transform .8s ease;
    will-change:opacity,transform;
}
.animation.is-visible{
    opacity:1;
    transform:none;
}
.fade-left{
    transform:translateX(-60px);
}
.fade-right{
    transform:translateX(60px);
}
.fade-up{
    transform:translateY(60px);
}
.fade-down{
    transform:translateY(-60px);
}
.zoom-in{
    transform:scale(.92);
}
.zoom-in.is-visible{
    transform:scale(1);
}
.delay-100{transition-delay:.1s;}
.delay-200{transition-delay:.2s;}
.delay-300{transition-delay:.3s;}
.delay-400{transition-delay:.4s;}
.delay-500{transition-delay:.5s;}
@media (prefers-reduced-motion:reduce){
    .animation,
    .fade-left,
    .fade-right,
    .fade-up,
    .fade-down,
    .zoom-in{
        opacity:1!important;
        transform:none!important;
        transition:none!important;
    }
}
.zoom{
    cursor: zoom-in;
}
.zoomOpen{
    position:fixed;
    inset:0;
    display:flex;
    justify-content:center;
    align-items:center;
    background:rgba(0,0,0,.92);
    opacity:0;
    transition:.25s;
    z-index:999999;
}
.zoomOpen.show{
    opacity:1;
}
.zoomOpen div{
    width:92vw;
    height:92vh;
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
    cursor:zoom-out;
}