/* --------------------------------------------
	LOAD IN ANIMATIONS
-------------------------------------------- */

.v-animation {
    -webkit-perspective: 600px;
    -moz-perspective: 600px;
    -ms-perspective: 600px;
    perspective: 600px;
    opacity: 0;
    position: relative;
}
    html.no-js .v-animation, .mobile-browser .v-animation, .apple-mobile-browser .v-animation, .v-animation[data-animation="none"] {
        opacity: 1!important;
        left: auto!important;
        right: auto!important;
        bottom: auto!important;
        -webkit-transform: scale(1)!important;
        -o-transform: scale(1)!important;
        -moz-transform: scale(1)!important;
        -ms-transform: scale(1)!important;
        transform: scale(1)!important;
    }

    .v-animation[data-animation="pop-up"].v-animate {
        -webkit-transform-style: preserve-3d;
        -moz-transform-style: preserve-3d;
        transform-style: preserve-3d;
        -webkit-transform: scale(0.2);
        -moz-transform: scale(0.2);
        -ms-transform: scale(0.2);
        -o-transform: scale(0.2);
        transform: scale(0.2);
        -webkit-animation: popUp 0.4s ease-in-out forwards;
        -moz-animation: popUp 0.4s ease-in-out forwards;
        -o-animation: popUp 0.4s ease-in-out forwards;
        animation: popUp 0.4s ease-in-out forwards;
    }
    .v-animation[data-animation="flip"].v-animate {
        -webkit-transform-style: preserve-3d;
        -moz-transform-style: preserve-3d;
        transform-style: preserve-3d;
        -webkit-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: rotateX(-80deg);
        -moz-transform: rotateX(-80deg);
        -ms-transform: rotateX(-80deg);
        -o-transform: rotateX(-80deg);
        transform: rotateX(-80deg);
        -webkit-animation: flip .8s ease-in-out forwards;
        -moz-animation: flip .8s ease-in-out forwards;
        -o-animation: flip .8s ease-in-out forwards;
        animation: flip .8s ease-in-out forwards;
    }
    .v-animation[data-animation="helix"].v-animate {
        -webkit-transform-style: preserve-3d;
        -moz-transform-style: preserve-3d;
        transform-style: preserve-3d;
        -webkit-transform: rotateY(-180deg);
        -moz-transform: rotateY(-180deg);
        -ms-transform: rotateY(-180deg);
        -o-transform: rotateY(-180deg);
        transform: rotateY(-180deg);
        -webkit-animation: helix .8s ease-in-out forwards;
        -moz-animation: helix .8s ease-in-out forwards;
        -o-animation: helix .8s ease-in-out forwards;
        animation: helix .8s ease-in-out forwards;
    }
    .v-animation[data-animation="move-up"].v-animate {
        -webkit-transform: translateY(30px);
        -moz-transform: translateY(30px);
        -ms-transform: translateY(30px);
        -o-transform: translateY(30px);
        transform: translateY(30px);
        -webkit-animation: moveUp 1s ease forwards;
        -moz-animation: moveUp 1s ease forwards;
        -o-animation: moveUp 1s ease forwards;
        animation: moveUp 1s ease forwards;
    }
	.v-animation[data-animation="move-down"].v-animate {
        -webkit-transform: translateY(-30px);
        -moz-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        -o-transform: translateY(-30px);
        transform: translateY(-30px);
        -webkit-animation: moveDown 1s ease forwards;
        -moz-animation: moveDown 1s ease forwards;
        -o-animation: moveDown 1s ease forwards;
        animation: moveDown 1s ease forwards;
    }
	.v-animation[data-animation="move-left"].v-animate {
        -webkit-transform: translateX(30px);
        -moz-transform: translateX(30px);
        -ms-transform: translateX(30px);
        -o-transform: translateX(30px);
        transform: translateX(30px);
        -webkit-animation: moveLeft 1s ease forwards;
        -moz-animation: moveLeft 1s ease forwards;
        -o-animation: moveLeft 1s ease forwards;
        animation: moveLeft 1s ease forwards;
    }
	.v-animation[data-animation="move-right"].v-animate {
        -webkit-transform: translateX(-30px);
        -moz-transform: translateX(-30px);
        -ms-transform: translateX(-30px);
        -o-transform: translateX(-30px);
        transform: translateX(-30px);
        -webkit-animation: moveRight 1s ease forwards;
        -moz-animation: moveRight 1s ease forwards;
        -o-animation: moveRight 1s ease forwards;
        animation: moveRight 1s ease forwards;
    }
    .v-animation[data-animation="spin"].v-animate {
        -webkit-animation: spin 0.65s ease forwards;
        -moz-animation: spin 0.65s ease forwards;
        -o-animation: spin 0.65s ease forwards;
        animation: spin 0.65s ease forwards;
    }
    .v-animation[data-animation="flip-x"].v-animate {
        -webkit-backface-visibility: visible;
        -moz-backface-visibility: visible;
        -o-backface-visibility: visible;
        backface-visibility: visible;
        -webkit-animation: flipX 0.65s ease forwards;
        -moz-animation: flipX 0.65s ease forwards;
        -o-animation: flipX 0.65s ease forwards;
        animation: flipX 0.65s ease forwards;
    }
    .v-animation[data-animation="flip-y"].v-animate {
        -webkit-backface-visibility: visible;
        -moz-backface-visibility: visible;
        -o-backface-visibility: visible;
        backface-visibility: visible;
        -webkit-animation: flipY 0.65s ease forwards;
        -moz-animation: flipY 0.65s ease forwards;
        -o-animation: flipY 0.65s ease forwards;
        animation: flipY 0.65s ease forwards;
    }

.browser-ie .v-animation[data-animation="pop-up"].v-animate, 
.browser-ie .v-animation[data-animation="flip"].v-animate, 
.browser-ie .v-animation[data-animation="helix"].v-animate, 
.browser-ie .v-animation[data-animation="move-up"].v-animate,
.browser-ie .v-animation[data-animation="move-down"].v-animate,
.browser-ie .v-animation[data-animation="move-left"].v-animate,
.browser-ie .v-animation[data-animation="move-right"].v-animate,
.browser-ie .v-animation[data-animation="spin"].v-animate, 
.browser-ie .v-animation[data-animation="flip-x"].v-animate, 
.browser-ie .v-animation[data-animation="flip-y"].v-animate {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}





/* #CSS3 Keyframes
================================================== */

@-webkit-keyframes fadeIn {
	to { opacity: 1; }
}

@-moz-keyframes fadeIn {
	to { opacity: 1; }
}

@keyframes fadeIn {
	to { opacity: 1; }
}

@-webkit-keyframes moveUp {
	to { -webkit-transform: translateY(0); opacity: 1; }
}
@-moz-keyframes moveUp {
	to { -moz-transform: translateY(0); opacity: 1; }
}
@keyframes moveUp {
	to { transform: translateY(0); opacity: 1; }
}

@-webkit-keyframes moveDown {
	to { -webkit-transform: translateY(0); opacity: 1; }
}
@-moz-keyframes moveDown {
	to { -moz-transform: translateY(0); opacity: 1; }
}
@keyframes moveDown {
	to { transform: translateY(0); opacity: 1; }
}

@-webkit-keyframes moveLeft {
	to { -webkit-transform: translateX(0); opacity: 1; }
}
@-moz-keyframes moveLeft {
	to { -moz-transform: translateX(0); opacity: 1; }
}
@keyframes moveLeft {
	to { transform: translateX(0); opacity: 1; }
}

@-webkit-keyframes moveRight {
	to { -webkit-transform: translateX(0); opacity: 1; }
}
@-moz-keyframes moveRight {
	to { -moz-transform: translateX(0); opacity: 1; }
}
@keyframes moveRight {
	to { transform: translateX(0); opacity: 1; }
}

@-webkit-keyframes flip {
	100% { -webkit-transform: rotateX(0deg); opacity: 1; }
}
@-moz-keyframes flip {
	100% { -moz-transform: rotateX(0deg); opacity: 1; }
}
@keyframes flip {
	100% { transform: rotateX(0deg); opacity: 1; }
}

@-webkit-keyframes helix {
	100% { -webkit-transform: rotateY(0deg); opacity: 1; }
}
@-moz-keyframes helix {
	100% { -moz-transform: rotateY(0deg); opacity: 1; }
}
@keyframes helix {
	100% { transform: rotateY(0deg); opacity: 1; }
}

@-webkit-keyframes popUp {
	70% { -webkit-transform: scale(1.1); opacity: .8; -webkit-animation-timing-function: ease-out; }
	100% { -webkit-transform: scale(1); opacity: 1; }
}
@-moz-keyframes popUp {
	70% { -moz-transform: scale(1.1); opacity: .8; -moz-animation-timing-function: ease-out; }
	100% { -moz-transform: scale(1); opacity: 1; }
}
@keyframes popUp {
	70% { transform: scale(1.1); opacity: .8; animation-timing-function: ease-out; }
	100% { transform: scale(1); opacity: 1; }
}

@-ms-keyframes spin {
    from { -ms-transform: rotate(0deg); }
    to { -ms-transform: rotate(360deg); opacity: 1; }
}
@-moz-keyframes spin {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(360deg); opacity: 1; }
}
@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); opacity: 1; }
}
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); opacity: 1; }
}

@-webkit-keyframes flipX {
    0% {-webkit-transform: perspective(400px) rotateX(90deg);opacity: 0;}
    100% {-webkit-transform: perspective(400px) rotateX(0deg);opacity: 1;}
}
@-moz-keyframes flipX {
    0% {-moz-transform: perspective(400px) rotateX(90deg);opacity: 0;}
    100% {-moz-transform: perspective(400px) rotateX(0deg);opacity: 1;}
}
@-o-keyframes flipX {
    0% {-o-transform: perspective(400px) rotateX(90deg);opacity: 0;}
    100% {-o-transform: perspective(400px) rotateX(0deg);opacity: 1;}
}
@keyframes flipX {
    0% {transform: perspective(400px) rotateX(90deg);opacity: 0;}
    100% {transform: perspective(400px) rotateX(0deg);opacity: 1;}
}

@-webkit-keyframes flipY {
    0% {-webkit-transform: perspective(400px) rotateY(90deg);opacity: 0;}
    100% {-webkit-transform: perspective(400px) rotateY(0deg);opacity: 1;}
}
@-moz-keyframes flipY {
    0% {-moz-transform: perspective(400px) rotateY(90deg);opacity: 0;}
	100% {-moz-transform: perspective(400px) rotateY(0deg);opacity: 1;}
}
@-o-keyframes flipY {
	0% {-o-transform: perspective(400px) rotateY(90deg);opacity: 0;}
	100% {-o-transform: perspective(400px) rotateY(0deg);opacity: 1;}
}
@keyframes flipY {
    0% {transform: perspective(400px) rotateY(90deg);opacity: 0;} 
    100% {transform: perspective(400px) rotateY(0deg);opacity: 1;}
}