/*flip loader*/

/* WebKit and Opera browsers */

@-webkit-keyframes spinner {
    from {
        -webkit-transform: rotateX(0deg);
    }
    to {
        -webkit-transform: rotateX(-360deg);
    }
}

/* all other browsers */

@keyframes spinner {
    from {
        -moz-transform: rotateX(0deg);
        -ms-transform: rotateX(0deg);
        transform: rotateX(0deg);
    }
    to {
        -moz-transform: rotateX(-360deg);
        -ms-transform: rotateX(-360deg);
        transform: rotateX(-360deg);
    }
}

.item-up {
    opacity: 0;
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -o-transform: scale(0.9);
    transform: scale(0.9);
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -ms-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all .5s ease-in-out;
}

.item-up.visible {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
}

.item-up-2, .item-up-3, .item-up-4, .item-up-5 {
    opacity: 0;
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -o-transform: scale(0.9);
    transform: scale(0.9);
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -ms-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all .5s ease-in-out;
}

.item-up-2.visible, .item-up-3.visible, .item-up-4.visible, .item-up-5.visible {
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
}

/* Dots */

@-webkit-keyframes Dots {
    0% {
        content: "";
    }
    33% {
        content: ".";
    }
    66% {
        content: "..";
    }
    100% {
        content: "...";
    }
}

@keyframes Dots {
    0% {
        content: "";
    }
    33% {
        content: ".";
    }
    66% {
        content: "..";
    }
    100% {
        content: "...";
    }
}

.shadow-drop-2-bottom {
    -webkit-animation: shadow-drop-2-bottom 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: shadow-drop-2-bottom 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@-webkit-keyframes shadow-drop-2-bottom {
    0% {
        -webkit-transform: translateZ(0) translateY(0);
        transform: translateZ(0) translateY(0);
    }
    100% {
        -webkit-transform: translateZ(50px) translateY(-12px);
        transform: translateZ(50px) translateY(-12px);
    }
}

@keyframes shadow-drop-2-bottom {
    0% {
        -webkit-transform: translateZ(0) translateY(0);
        transform: translateZ(0) translateY(0);
    }
    100% {
        -webkit-transform: translateZ(50px) translateY(-12px);
        transform: translateZ(50px) translateY(-12px);
    }
}

@keyframes moveInBottom {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: translate(0);
    }
}

/* Page turn */

@-webkit-keyframes pageTurn {
    0% {
        -webkit-transform: rotateY( 0deg);
        transform: rotateY( 0deg);
    }
    20% {
        background: #4b1e77;
    }
    40% {
        background: rebeccapurple;
        -webkit-transform: rotateY( -180deg);
        transform: rotateY( -180deg);
    }
    100% {
        background: rebeccapurple;
        -webkit-transform: rotateY( -180deg);
        transform: rotateY( -180deg);
    }
}

@keyframes pageTurn {
    0% {
        transform: rotateY( 0deg);
    }
    20% {
        background: #4b1e77;
    }
    40% {
        background: rebeccapurple;
        transform: rotateY( -180deg);
    }
    100% {
        background: rebeccapurple;
        transform: rotateY( -180deg);
    }
}

/* Dots */

@-webkit-keyframes Dots {
    0% {
        content: "";
    }
    33% {
        content: ".";
    }
    66% {
        content: "..";
    }
    100% {
        content: "...";
    }
}

@keyframes Dots {
    0% {
        content: "";
    }
    33% {
        content: ".";
    }
    66% {
        content: "..";
    }
    100% {
        content: "...";
    }
}