@keyframes brandBlendIn {

    from {
        opacity: 0;
        transform: translateX(-50px);

    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes logoRotate {

    from {

        transform: rotate(0deg);

    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes menuBlendIn {

    from {
        opacity: 0;
        transform: translateX(100px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes sideNavIn{

    from {
        right: -280;
    }

    to {
        right: 0;
    }
}

@keyframes sideNavOut{

    from {
        right: 0;
    }

    to {
        right: -280;
    }

}