/*
@keyframes bgZoomIn {   
    0% { background-size: 100%; animation-timing-function: ease-in; }
    8% { background-size: 110%; animation-timing-function: ease-out; }
    17% { background-size: 120%; }
    25% { background-size: 120%; }
    100% { background-size: 120%; }
}
*/


@keyframes slideRightToLeft {
    0% {
        opacity: 0;
        left: 100%;
    }
    33% {
        opacity: 1;
    }
    100% {
        opacity: 1;
        left: 0px;
    }
}


@keyframes showItem {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }
    90% {
        opacity: 0.75;
        transform: scale(1.1);
    }
    100% {
        opacity: 1;
        transform: scale(1.0);
    }
}

/*
* Stamps
*/

@-o-keyframes stampRotation {
    0% {
        opacity: 0;
        -o-animation-timing-function: ease;
    }
    3% {
        opacity: 1;
    }
    30% {
        opacity: 1;
    }
    33% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@-ms-keyframes stampRotation {
    0% {
        opacity: 0;
        -ms-animation-timing-function: ease;
    }
    3% {
        opacity: 1;
    }
    30% {
        opacity: 1;
    }
    33% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@-moz-keyframes stampRotation {
    0% {
        opacity: 0;
        -moz-animation-timing-function: ease;
    }
    3% {
        opacity: 1;
    }
    30% {
        opacity: 1;
    }
    33% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes stampRotation {
    0% {
        opacity: 0;
        -webkit-animation-timing-function: ease;
    }
    3% {
        opacity: 1;
    }
    30% {
        opacity: 1;
    }
    33% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@keyframes stampRotation {
    0% {
        opacity: 0;
        animation-timing-function: ease;
    }
    3% {
        opacity: 1;
    }
    30% {
        opacity: 1;
    }
    33% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

/*
* BG fade and zoom
*/

@-o-keyframes bgImageAnimation {
    0% {
        opacity: 0;
        -o-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -o-transform: scale(1.05);
        -o-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -o-transform: scale(1.1);
    }
    25% {
        opacity: 0;
        -o-transform: scale(1.1);
    }
    100% {
        opacity: 0;
    }
}

@-ms-keyframes bgImageAnimation {
    0% {
        opacity: 0;
        -ms-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -ms-transform: scale(1.05);
        -ms-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -ms-transform: scale(1.1);
    }
    25% {
        opacity: 0;
        -ms-transform: scale(1.1);
    }
    100% {
        opacity: 0;
    }
}

@-moz-keyframes bgImageAnimation {
    0% {
        opacity: 0;
        -moz-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -moz-transform: scale(1.05);
        -moz-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -moz-transform: scale(1.1);
    }
    25% {
        opacity: 0;
        -moz-transform: scale(1.1);
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes bgImageAnimation {
    0% {
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -webkit-transform: scale(1.05);
        -webkit-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -webkit-transform: scale(1.1);
    }
    25% {
        opacity: 0;
        -webkit-transform: scale(1.1);
    }
    100% {
        opacity: 0;
    }
}

@keyframes bgImageAnimation {
    0% {
        opacity: 0;
        animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        transform: scale(1.05);
        animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        transform: scale(1.1);
    }
    25% {
        opacity: 0;
        transform: scale(1.1);
    }
    100% {
        opacity: 0;
    }
}

/*
* BG fade only
*/

@-o-keyframes bgImageAnimationWithoutZoom {
    0% {
        opacity: 0;
        -o-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -o-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@-ms-keyframes bgImageAnimationWithoutZoom {
    0% {
        opacity: 0;
        -ms-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -ms-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@-moz-keyframes bgImageAnimationWithoutZoom {
    0% {
        opacity: 0;
        -moz-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -moz-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes bgImageAnimationWithoutZoom {
    0% {
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -webkit-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@keyframes bgImageAnimationWithoutZoom {
    0% {
        opacity: 0;
        animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

/*
* MENU visible
*/

@keyframes menuAnimation {
    0% {
        opacity: 0;
        height: 0px;
    }
    100% {
        opacity: 1;
        height: 250px;
    }
}

@-webkit-keyframes menuAnimation {
    0% {
        opacity: 0;
        height: 0px;
    }
    100% {
        opacity: 1;
        height: 250px;
    }
}

@-moz-keyframes menuAnimation {
    0% {
        opacity: 0;
        height: 0px;
    }
    100% {
        opacity: 1;
        height: 250px;
    }
}

@-ms-keyframes menuAnimation {
    0% {
        opacity: 0;
        height: 0px;
    }
    100% {
        opacity: 1;
        height: 250px;
    }
}

@-o-keyframes menuAnimation {
    0% {
        opacity: 0;
        height: 0px;
    }
    100% {
        opacity: 1;
        height: 250px;
    }
}