.anim_0 { 

    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -ms-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s; 

    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;

    -webkit-animation-delay: 200ms;
    -moz-animation-delay: 200ms;
    -ms-animation-delay: 200ms;
    -o-animation-delay: 200ms;
    animation-delay: 200ms;

    -webkit-animation-timing-function: cubic-bezier(0.79,0.02,0.25,0.98);
    -moz-animation-timing-function: cubic-bezier(0.79,0.02,0.25,0.98);
    -ms-animation-timing-function: cubic-bezier(0.79,0.02,0.25,0.98);
    -o-animation-timing-function: cubic-bezier(0.79,0.02,0.25,0.98);
    animation-timing-function:ease-in cubic-bezier(0.79,0.02,0.25,0.98);
} 



/* FADEIN */
.anim_1 { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    animation-delay: 800ms;
    -webkit-animation-delay: 800ms;
} 
.anim_2 { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    animation-delay: 1200ms;
    -webkit-animation-delay: 1200ms;
} 

@-webkit-keyframes fadeIn { 
    0% {opacity: 0;} 
    100% {opacity: 1;} 
}
@-moz-keyframes fadeIn { 
    0% {opacity: 0;} 
    100% {opacity: 1;} 
}
@-ms-keyframes fadeIn { 
    0% {opacity: 0;} 
    100% {opacity: 1;} 
}
@-o-keyframes fadeIn { 
    0% {opacity: 0;} 
    100% {opacity: 1;} 
} 
@keyframes fadeIn { 
    0% {opacity: 0;} 
    100% {opacity: 1;} 
} 
.anim_fadeIn { 
    -webkit-animation-name: fadeIn; 
    animation-name: fadeIn; 
}

@-webkit-keyframes tiltIn { 
    0% {-webkit-transform: rotateX(60deg);} 
    100% {-webkit-transform: rotateX(0deg);} 
} 
@-moz-keyframes tiltIn { 
    0% {-moz-transform: rotateX(60deg);} 
    100% {-moz-transform: rotateX(0deg);} 
} 
@-ms-keyframes tiltIn { 
    0% {-ms-transform: rotateX(60deg);} 
    100% {-ms-transform: rotateX(0deg);} 
} 
@-o-keyframes tiltIn { 
    0% {-o-transform: rotateX(60deg);} 
    100% {-o-transform: rotateX(0deg);} 
} 
@keyframes tiltIn { 
    0% {transform: rotateX(60deg);} 
    100% {transform: rotateX(0deg);} 
} 

.anim_tiltIn { 
    -webkit-animation-name: tiltIn; 
    -moz-animation-name: tiltIn; 
    -ms-animation-name: tiltIn; 
    -o-animation-name: tiltIn; 
    animation-name: tiltIn; 
}

@-webkit-keyframes tiltInY { 
    0% {-webkit-transform: rotateY(10deg);} 
    100% {-webkit-transform: rotateY(0deg);} 
} 
@-moz-keyframes tiltInY { 
    0% {-moz-transform: rotateY(10deg);} 
    100% {-moz-transform: rotateY(0deg);} 
} 
@-ms-keyframes tiltInY { 
    0% {-ms-transform: rotateY(10deg);} 
    100% {-ms-transform: rotateY(0deg);} 
} 
@-o-keyframes tiltInY { 
    0% {-o-transform: rotateY(10deg);} 
    100% {-o-transform: rotateY(0deg);} 
} 
@keyframes tiltInY { 
    0% {transform: rotateY(10deg);} 
    100% {transform: rotateY(0deg);} 
} 

.anim_tiltInY { 
    -webkit-animation-name: tiltInY; 
    -moz-animation-name: tiltInY; 
    -ms-animation-name: tiltInY; 
    -o-animation-name: tiltInY; 
    animation-name: tiltInY; 
}



/* SWING ANIMATION */
.left_tile, .right_tile {
    perspective: 600px;
    -webkit-perspective: 600px;
    -moz-perspective: 600px;
    -ms-perspective: 600px;
    perspective-origin: 50%, 50%;
    -webkit-perspective-origin: 50%, 50%;

    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    -ms-transition: all 2s ease;
    -o-transition: all 2s ease;
    transition: all 2s ease;
}

.left_tile {
    transform-origin: left;
    -webkit-transform-origin: left;

    transform:rotateY(45deg);
    -webkit-transform:rotateY(45deg);
    -moz-transform:rotateY(45deg);
    -ms-transform:rotateY(45deg);
}
.right_tile {
    transform-origin: right;
    -webkit-transform-origin: right;

    transform:rotateY(-45deg);
    -webkit-transform:rotateY(-45deg);
    -moz-transform:rotateY(-45deg);
    -ms-transform:rotateY(-45deg);
}

@keyframes tileswing_r
{
from {transform:rotateY(45deg); -webkit-transform:rotateY(45deg); opacity: 0;}
to {transform:rotateY(0deg); -webkit-transform:rotateY(0deg); opacity: 1;}
}

@-webkit-keyframes tileswing_r /* Safari and Chrome */
{
from {transform:rotateY(45deg); -webkit-transform:rotateY(45deg); opacity: 0;}
to {transform:rotateY(0deg); -webkit-transform:rotateY(0deg); opacity: 1;}
}

@keyframes tileswing_l
{
from {transform:rotateY(-45deg); -webkit-transform:rotateY(-45deg); opacity: 0;}
to {transform:rotateY(0deg); -webkit-transform:rotateY(0deg); opacity: 1;}
}

@-webkit-keyframes tileswing_l /* Safari and Chrome */
{
from {transform:rotateY(-45deg); -webkit-transform:rotateY(-45deg); opacity: 0;}
to {transform:rotateY(0deg); -webkit-transform:rotateY(0deg); opacity: 1;}
}






.tab {
    animation: tabswing 2s;
    -webkit-animation: tabswing 2s;

    transform-origin: top;
    -webkit-transform-origin: top;
}
.tabs {
    perspective: 100px;
    -webkit-perspective: 100px;
    -moz-perspective: 100px;
    -ms-perspective: 100px;
    perspective-origin: 50% 0%;
    -webkit-perspective-origin: 50% 0%;
}

@keyframes tabswing
{
from {transform:rotateX(-90deg); opacity: 0;}
to {transform:rotateX(0deg); -webkit-transform:rotateX(0deg); opacity: 1;}
}

@-webkit-keyframes tabswing /* Safari and Chrome */
{
from {-webkit-transform:rotateX(-90deg); opacity: 0;}
to {transform:rotateX(0deg); -webkit-transform:rotateX(0deg); opacity: 1;}
}





@-webkit-keyframes flip_in { 
    0% {-webkit-transform: rotateX(-90deg); opacity: 0.2;} 
    100% {-webkit-transform: rotateX(0deg); opacity: 1;} 
} 
@-moz-keyframes flip_in { 
    0% {-moz-transform: rotateX(-90deg); opacity: 0.2;} 
    100% {-moz-transform: rotateX(0deg); opacity: 1;} 
} 
@-ms-keyframes flip_in { 
    0% {-ms-transform: rotateX(-90deg); opacity: 0.2;} 
    100% {-ms-transform: rotateX(0deg); opacity: 1;} 
} 
@-o-keyframes flip_in { 
    0% {-o-transform: rotateX(-90deg); opacity: 0.2;} 
    100% {-o-transform: rotateX(0deg); opacity: 1;} 
} 
@keyframes flip_in { 
    0% {transform: rotateX(-90deg); opacity: 0.2;} 
    100% {transform: rotateX(0deg); opacity: 1;} 
} 

.anim_flip_in { 
    -webkit-animation-name: flip_in; 
    -moz-animation-name: flip_in; 
    -ms-animation-name: flip_in; 
    -o-animation-name: flip_in; 
    animation-name: flip_in; 
}