@media (prefers-reduced-motion: no-preference) {
    :root {
        scroll-behavior:smooth
    }
}


@keyframes slideInDown {
    from {
        transform: translate3d(0, -100%, 0);
        visibility:visible
    }

    to {
        transform:translate3d(0, 0, 0)
    }
}

.slideInDown {
    animation-name: slideInDown;
    animation-duration: 1.25s;
}

@keyframes bounceIn {
    20%, 40%, 60%, 80%, from, to {
        animation-timing-function:cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform:scale3d(.3, .3, .3)
    }

    20% {
        transform:scale3d(1.1, 1.1, 1.1)
    }

    40% {
        transform:scale3d(.9, .9, .9)
    }

    60% {
        opacity: 1;
        transform:scale3d(1.03, 1.03, 1.03)
    }

    80% {
        transform:scale3d(.97, .97, .97)
    }

    to {
        opacity: 1;
        transform:scale3d(1, 1, 1)
    }
}

.bounceIn {
    animation-name:bounceIn;
    animation-duration: 1.25s;
}

@keyframes arrowdown {
    0% {
        transform: translateY(0px);
        -webkit-transform: translateY(0px);
    }

    50% {
        transform: translateY(-5px);
        -webkit-transform: translateY(-5px);
    }

    100% {
        transform: translateY(0px);
        -webkit-transform: translateY(0px);
    }
}

@-webkit-keyframes arrowdown {
    0% {
        transform: translateY(0px);
        -webkit-transform: translateY(0px);
    }

    50% {
        transform: translateY(-5px);
        -webkit-transform: translateY(-5px);
    }

    100% {
        transform: translateY(0px);
        -webkit-transform: translateY(0px);
    }
}