/* Agemo Coin Download Page Animations Stylesheet */

@keyframes LogoAnimation {
    from {
        opacity: 0;
        margin-top: 50vh;
    }
    
    to {
        opacity: 1.0;
        margin-top: 5vh;
    }
}

.usesLogoAnimation {
    animation-name: LogoAnimation;
    animation-duration: 2.5s;
    animation-fill-mode: forwards; /* Stay on last frame */
}

@keyframes BackgroundFadeIn {
    from {
        backdrop-filter: blur(0px);
        background-color: #11111100;
        border-left: 4px #21252B00 solid;
        border-right: 4px #21252B00 solid;
    }
    
    to {
        backdrop-filter: blur(16px);
        background-color: #11111199;
        border-left: 4px #21252B88 solid;
        border-right: 4px #21252B88 solid;
    }
}

.usesBackgroundFadeIn {
    animation-name: BackgroundFadeIn;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}

@keyframes ForegroundFadeIn {
    from {
        opacity: 0;
    }
    
    to {
        opacity: 1;
    }
}

.usesForegroundFadeIn {
    animation-name: ForegroundFadeIn;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}