/*
global-animation.css
====================
This file is included across the entire site when
animations are enabled for the theme. If you wish
to effect the css of anything globally and it is
animation related for this specific theme, then
please do so here.

Please make sure you comment EACH tag or class
you modify the animation styling of, so if someone
comes along in the future, they understand in DETAIL
what the tag styling is doing and why

See detailed documentation here:-
	https://docs.google.com/document/d/1n5sWQ8SIr-zjOpTv8YnOTHJapO8WdedjDfbeo-lkqMM/edit#heading=h.lmxb59mpcpe2


*/

    /* Fade the page container in  */
        .page-global-container
        {
            opacity: 0;
        }

    /* If we are on the homepage wrap the navigation */
        .home-animation-navigation-wrapper
        {

        }

    /* Initally hide navigation items */
        .home-animation-navigation-wrapper .nav-item
        {
            opacity: 0;
        }

    /* Initally hide nav bar icons */
        .home-animation-navigation-wrapper .nav-bar-icon
        {
            opacity: 0;
            -webkit-transition: opacity 0.3s;
            -o-transition: opacity 0.3s;
            transition: opacity 0.3s;
        }

    /* Initally hide the logo */
        .home-animation-navigation-wrapper .logo-container
        {
            opacity: 0;
            -webkit-transition: opacity 1s;
            -o-transition: opacity 1s;
            transition: opacity 1s;
        }

    /* Initally hide the header */
        .home-animation-navigation-wrapper .header
        {
            /* Fix a navigation bug on mobile when animation is enabled */
                width: 100vw!important;

            opacity: 0;
            -webkit-transition: top 1s, opacity 0.5s;
            -o-transition: top 1s, opacity 0.5s;
            transition: top 1s, opacity 0.5s;
        }

    /* Set the opacity of the slider to 0 */
        .slideshow-container
        {
            opacity: 0;
        }