/*Styles which were added in the default layouts header area moved to our custom css file */

@media screen {
    .stage-1-content, .stage-2-content > * {
        visibility: hidden;
        opacity: 1;
        -webkit-transition: opacity .2s;
        transition: opacity .2s;
    }

    .stage-2-content:before {
        content: "";
        border: 4px solid hsla(0,0%,7%,.1);
        border-left-color: #cf0010;
        border-radius: 50%;
        display: block;
        width: 50px;
        height: 50px;
        position: absolute;
        top: calc(50vh - 25px);
        left: calc(50vw - 25px);
        -webkit-transition: opacity .2s;
        transition: opacity .2s;
        -webkit-animation-name: spin;
        animation-name: spin;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear
    }

    body.stage-2-loaded .stage-2-content:before {
        opacity: 0
    }

    body.stage-1-loaded .stage-1-content, body.stage-2-loaded .stage-2-content > * {
        visibility: visible;
        opacity: 1
    }

    @-webkit-keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg)
        }

        to {
            -webkit-transform: rotate(1turn);
            transform: rotate(1turn)
        }
    }

    @keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg)
        }

        to {
            -webkit-transform: rotate(1turn);
            transform: rotate(1turn)
        }
    }
}